rollup也是一款打包工具,比webpack要轻量许多,用于弥补gulp的无tree-shaking是很好的选择,最大的用途是打包生产一个库文件,比如sdk.js之类。虽然webpack也可以做到,但是webpack较重,打包后的文件有部分webpack内部代码,如__webpack__require之类的函数定义,给人一种不干净的感觉。而rollup打出来的包就很干净,没有其他冗余代码。鲸鱼 注我用它打包过:单个d3图形包使用方式通过插件导入commonjs模块需要两个插件共用rollup-plugin-commonjs rollup-plugin-node-resolve// rollup.config.jsimport commonjs from ‘rollup-plugin-commonjs’;import nodeResolve from ‘rollup-plugin-node-resolve’;export default { input: ‘main.js’, output: { file: ‘bundle.js’, format: ‘iife’ }, plugins: [ nodeResolve({ jsnext: true, main: true }), commonjs({ // non-CommonJS modules will be ignored, but you can also // specifically include/exclude files include: ’node_modules/’, // Default: undefined exclude: [ ’node_modules/foo/’, ’node_modules/bar/**’ ], // Default: undefined // these values can also be regular expressions // include: /node_modules/ // search for files other than .js files (must already // be transpiled by a previous plugin!) extensions: [ ‘.js’, ‘.coffee’ ], // Default: [ ‘.js’ ] // if true then uses of global
won’t be dealt with by this plugin ignoreGlobal: false, // Default: false // if false then skip sourceMap generation for CommonJS modules sourceMap: false, // Default: true // explicitly specify unresolvable named exports // (see below for more details) namedExports: { ‘./module.js’: [‘foo’, ‘bar’ ] }, // Default: undefined // sometimes you have to leave require statements // unconverted. Pass an array containing the IDs // or a id => boolean
function. Only use this // option if you know what you’re doing! ignore: [ ‘conditional-runtime-dependency’ ] }) ]};现实项目示例可以戳 vue源码这里然后在配置的plugins里面使用 参考Rollup常用配置rollup.js 文档