Webpack VS Rollup

Webpack

大型SPA项目的模块化构建，也就是我们常说的web应用

• 通过各种Loader处理各种各样的静态资源
• 通过各种插件Plugins对整体文件进行一些处理
• Code splitting将公共模块进行提取
• 提供一个webpack-dev-server，进行本地开发
• 支持HMR模块热替换

Rollup

Rollup设计之初就是面向ES module的，构建出结构扁平、性能出众的类库

对比

构建App应用时，webpack比较合适，如果是类库（纯js项目），rollup更加合适

Webpack的优势：

• 强大的生态插件
• 面向开发应用的特性支持HMR、按需加载、公共模块提取
• 简化Web开发的环节，图片自动转base64，资源的缓存（添加chunkId）

Rollup的优势：

• 构建高性能的模块文件，这正是类库需要的
• 编译出来的代码可读性好，内容更小，执行效率更高
• 配置比较简单