基于rollup搭建JavaScript类库开发环境

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了基于rollup搭建JavaScript类库开发环境相关的知识,希望对你有一定的参考价值。

 
平时开发过程中,积累了不少的经验和技巧都应用到项目中,而下次用到的时候却又开始到处翻。
有时也想自己搭建个类库或工具包什么的来积累自己的经验技巧,又没有专门的时间去搭建各种
环境,像rollup或者webpack这样的打包工具、ES6转码工具Babel、Eslint、Jest测试工具等等。
这里就特意做了一个起始项目,将rollup、ES6转码、Eslint、Jest都集成起来,平时用的时候只需要
积累模块和方法即可。
 
本文参考:基于Webpack和ES6打造javascript类库 http://web.jobbole.com/84858/,由于webpack打包
类库的时候会附带一个小型的加载器,有点多余,因此选用rollup搭建。
 
# 要点记录
1. 使用`rollup.js`提供的`Js api`进行`bundle`打包
2. 使用`babel`转码类库中的`ES2015`语法,不对`module`转换,由`rollup`处理
3. `Node`版本要大于`7.10.1`版本,因为构建脚本中使用了`await`、`async`
4. 使用`jest`进行单元测试,同时使用`rollup-plugin-babel`转换测试脚本语法,配置文件为`.babelrc`中`test`节
5. `sourcemap`的生成由`bundle.write`完成,而转码后的源代码由`fs`模块写入
希望大家都能把平时的努力积累起来,最终垒成自己的技术高楼。

以上是关于基于rollup搭建JavaScript类库开发环境的主要内容,如果未能解决你的问题,请参考以下文章

rollup 实战第二节 搭建开发环境

rollup 实战第三节 打包生产

基于rollup + typescript开发vue组件,可使用ts装饰器

15款不容错过的前端开发Javascript和css类库 - 2017版本~

esbuild 配置开发环境

使用rollup 开发专业js library