经验教程：Rollup.js模块打包器

作者：曾启澔

 

前言：

为什么要模块化

一般情况下，单一的中小型项目没有将自己模块化打包的必要。然而在实际工作或者开源项目开发的场合下，往往会有需要将当前项目或者其中一部分功能性代码在其他项目中使用的场景。若仅仅简单的对代码的复制黏贴，会对代码的管理以及后续开发改进产生极大的不便，代码每有改动就需要在各个项目中保持同步更新，非常不便。此时对代码进行模块化打包是一个非常值得考虑的手段，模块化后的代码能非常便利的在其他项目中进行使用，并解决了代码内容变动产生的差异化问题。

模块化的好处

· 项目组建分割化开发，降低复杂度

· 开发通用Library、可于多个不同项目中应用同一处理模块

· 能够轻松植入到第三方代码中

关于Rollup：

Rollup.js是什么

Rollup是一个目前较为流行的JavaScript模块打包器。常见的JavaScript的开源程序及Library的模块化打包都是用到了Rollup。

Rollup.js的特点

· 兼容性高：可以自由打包成目前常规的模块类型（如CommonJS和ES6），兼容各个浏览器标准

· 统一处理：可对全体代码（包括引用模块）的语法格式统一，纠错，进行统一处理

· 压缩：对代码进行压缩处理，产出更小容量的代码文件插件：庞大的插件库，并支持自定义插件开发

· 庞大的插件库

· 打包速度快、配置简单

开始Rollup

Rollup.js的安装

安装Rollup前，首先需要安装Node.js。具体方法请参考官方文档。

1. 全局安装：

npm install rollup -g

安装完后可以通过以下命令确认是否安装成功，若显示版本号说明可以正常使用Rollup了。

rollup -version

2. 项目中安装（推荐）：

一般来说，为了保证在任何环境下都能正常进行模块化打包，采取在项目中安装依赖的做法更为常用。于项目根目录执行以下代码，将rollup于