简介
概括
Rollup 是一个用于 JavaScript 的模块打包工具，它将小的代码片段编译成更大、更复杂的代码，例如库或应用程序。它使用JavaScript的ES6版本中包含的新标准化代码模块格式。
安装
npm install --global rollup
使用
可以通过带有可选配置文件的 命令行界面 或 JavaScript API 来使用 Rollup。
假定应用程序入口文件为
main.js，并且希望将所有导入编译到一个名为bundle.js的单个文件中。
main.js示例：
console.log('我是main.js');
对于浏览器：
# 编译为包含自执行函数（'iife'）的 <script>。
rollup main.js --file bundle.js --format iife
打包后的bundle.js：
(function () {
'use strict';
console.log('我是main.js');
})();
对于Node.js：
# 编译为一个 CommonJS 模块 ('cjs')
rollup main.js --file bundle.js --format cjs
打包后的bundle.js：
'use strict';
console.log('我是main.js');
对于浏览器和Node.js：
# UMD 格式需要一个包名
rollup main.js --file bundle.js --format umd --name "common"
打包后的bundle.js：
(function (factory) {
typeof define === 'function' && define.amd ? define(factory) :
factory();
})((function () { 'use strict';
console.log('我是main.js');
}));
背景
ES6（模块化）仅在现代浏览器中实现，并未在Node.js中完全落地。Rollup允许你使用新的模块系统编写代码，然后将其编译回现有的格式，例如CommonJS模块、AMD模块和IIFE样式脚本。 参考：rollup.js中文网
优势
除屑优化（Tree-Shaking)
除了可以使用 ES 模块之外，Rollup 还可以静态分析你导入的代码，并将排除任何实际上没有使用的内容。这使你可以在现有的工具和模块的基础上构建，而不需要添加额外的依赖项或使项目的大小变得臃肿。
例如入口文件如下main.js
import * as util from './util'
// ‘啊啊啊’
util.log('aaa');
util.js如下：
function log (value) {
return console.log('log: ', value)
}
function warn (value) {
return console.warn('warn: ', value)
}
// module.exports = { log, warn }
// util：
export { log, warn }
对于浏览器打包的bundle.js：
(function () {
'use strict';
function log (value) {
return console.log('log: ', value)
}
// ‘啊啊啊’
log('aaa');
})();
对于Node.js打包的bundle.js：
'use strict';
function log (value) {
return console.log('log: ', value)
}
// ‘啊啊啊’
log('aaa');
对于浏览器和Node.js打包的bundle.js：
(function (factory) {
typeof define === 'function' && define.amd ? define(factory) :
factory();
})((function () { 'use strict';
function log (value) {
return console.log('log: ', value)
}
// ‘啊啊啊’
log('aaa');
}));
兼容性
导入CommonJS
Rollup 可以通过插件 导入现有的 CommonJS 模块。
发布ES模块
为了确保你的 ES 模块可以立即被处理 CommonJS 的工具，例如 Node.js 和 webpack 使用，你可以使用 Rollup 编译成 UMD 或 CommonJS 格式，然后在 package.json 文件中使用 main 属性指向编译后的版本。如果你的 package.json 文件还有一个 module 字段，那么像 Rollup 和 webpack 2+ 这样的可感知 ES 模块的工具将直接 导入 ES 模块版本。
