rollup 提供了插件rollup-plugin-commonjs ，以便于在 rollup 中引用 commonjs 规范的包。该插件的作用是将 commonjs 模块转成 es6 模块。
rollup-plugin-commonjs 通常与 rollup-plugin-node-resolve 一同使用，后者用来解析依赖的模块路径。
安装模块
npm install --save-dev rollup-plugin-commonjs rollup-plugin-node-resolve
更新 rollup.config.js
import babel from 'rollup-plugin-babel'; import resolve from 'rollup-plugin-node-resolve'; import commonjs from 'rollup-plugin-commonjs'; export default { plugins: [ resolve({ jsnext: true, main: true, browser: true, }), commonjs(), babel({ exclude: 'node_modules/**', }), ], };
注意： jsnext 表示将原来的 node 模块转化成 ES6 模块，main 和 browser 则决定了要将第三方模块内的哪些代码打包到最终文件中。
替代环境变量
安装模块
rollup-plugin-replace 本质上是一个用来查找和替换的工具。它可以做很多事，但对我们来说只需要找到目前的环境变量并用实际值来替代就可以了。（例如：在 bundle 中出现的所有 ENV 将被 "production" 替换）
npm install --save-dev rollup-plugin-replace
更新 rollup.config.js
配置很简单：我们可以添加一个 key:value 的配对表，key 值是准备被替换的键值，而 value 是将要被替换的值。
import replace from "rollup-plugin-replace"; export default { plugins: [ replace({ ENV: JSON.stringify(process.env.NODE_ENV || "development") }) ] };
在我们的配置中找到每一个 ENV 并用 process.env.NODE_ENV 去替换，SON.stringify 用来确保值是双引号的，不像 ENV 这样。
压缩 bundle
添加 UglifyJS 可以通过移除注上释、缩短变量名、重整代码来极大程度的减少 bundle 的体积大小 —— 这样在一定程度降低了代码的可读性，但是在网络通信上变得更有效率。
安装插件
用下面的命令来安装rollup-plugin-uglify ：
npm install --save-dev rollup-plugin-uglify
更新 rollup.config.js
接下来，让我们在 Rollup 配置中添加 Uglify 。然而，为了在开发中使代码更具可读性，让我们来设置只在生产环境中压缩混淆代码：
import uglify from "rollup-plugin-uglify"; export default { plugins: [ process.env.NODE_ENV === "production" && uglify() ] };
这里使用了短路计算策略，只有在 NODE_ENV 设置为 production 时加载 uglify()。
完整配置
最后附上我的 rollup.config.js 配置
import resolve from 'rollup-plugin-node-resolve'; import commonjs from 'rollup-plugin-commonjs'; import { eslint } from 'rollup-plugin-eslint'; import babel from 'rollup-plugin-babel'; import replace from 'rollup-plugin-replace'; import { uglify } from 'rollup-plugin-uglify'; const packages = require('./package.json'); const ENV = process.env.NODE_ENV; const paths = { input: { root: ENV === 'example' ? 'example/index.js' : 'src/index.js', }, output: { root: ENV === 'example' ? 'example/dist/' : 'dist/', }, }; const fileNames = { development: `${packages.name}.js`, example: `example.js`, production: `${packages.name}.min.js` }; const fileName = fileNames[ENV]; export default { input: `${paths.input.root}`, output: { file: `${paths.output.root}${fileName}`, format: 'umd', name: 'bundle-name' }, plugins: [ resolve(), commonjs(), eslint({ include: ['src/**'], exclude: ['node_modules/**'] }), babel({ exclude: 'node_modules/**', runtimeHelpers: true, }), replace({ exclude: 'node_modules/**', ENV: JSON.stringify(process.env.NODE_ENV), }), (ENV === 'production' && uglify()), ], };