项目地址：可以下载进行查看学习，在下面提到的插件基本在我的demo项目中都有用到。
如果你在使用我的demo项目中有什么问题，可以在文章下面留言，我们一起交流学习
特别声明：
如果你的工作内容是基于es2015（也就是es6），并且不需要代码分割，也不需要模块热替换（HMR)，那么你可以很愉快的使用rollup进行开发了。不然，建议使用gulp+rollup。让gulp去解决那些问题。
优势（与webpack相比）
-
代码的内容格式：编译运行出来的内容，人能看，并且能调试。如果你没办法理解我说的话，可以去看看webpack打包出来的代码
-
命令行的角度：比webpack更加的人性化，有什么问题或者警告都很详细的描述出来，并且准确的提供问题所在文件的位置，方便查找问题
-
如果是引入第三方的js，一旦import进来就会加载进入入口文件中，但如果不是第三方的js，要引入进来之后只有当你对它进行export或者运行了它，才会被解析到入口文件中
所用插件
-
"babel-plugin-external-helpers": 这个模块是在.babelrc文件中体现，目的是让babel转义出来的帮助性代码只在该文件的头部出现一次，而不会再每个引入的模块中加入
-
"babel-preset-latest": 这个模块也是在.babelrc文件中体现，目的是让babel转义的操作移至的最后，等rollup编译代码之后，否则会出错
-
"rollup-plugin-babel": babel转义
-
"rollup-plugin-node-resolve": 将import的代码的代码和自己写的代码打包打在一起
-
"rollup-plugin-uglify": 压缩代码
-
"rollup-watch": 实时监听代码，有修改自动编译
比较好用的插件
- rollup-plugin-multi-entry 多入口打包情况
- rollup-plugin-multidest 多出口打包情况
- gulp-rollup-each 基于gulp的rollup转译的多入口到多出口（本项目中没有涉及到）
- rollup-plugin-license 增加文件头部注释
体积比较
针对于本项目来说：
不使用压缩的前提：rollup打包出来的比webpack的少大概120kb
使用压缩的前提：rollup打包出来的比webpack的少大概30kb
工具使用问题总结
-
当format改变为umd和iife的时候，如果你的入口文件中有export，那么就需要添加moduleName这个参数，为它产出的文件整体加个变量
问题解决地址：https://github.com/rollup/rollup/issues/1157 -
当你遇到下面这个问题的时候：
Error transforming bundle with 'uglify' plugin: SyntaxError:
你可以使用"uglify-js-harmony"这个库配合"rollup-plugin-uglify"使用，我在项目也详细使用到了。
问题解决地址:rollup-plugin-uglify issues地址
网友评论