我最近一直在研究rollup，看看它与Webpack和其他Bundle 包有什么不同.我遇到的一件事是，由于"扁平Bundle "，它对图书馆更有利.这是以tweet和a recent PR for React to utilize Rollup为基础的.
根据我的经验，Rollup更擅长构建库，因为它对扁平Bundle (例如提升)进行了更好的优化.1/2
不过，如果你将应用程序与代码拆分等Bundle 在一起，Webpack 2可能会对你更好.2/2
但我不完全确定我是否理解这意味着什么.扁平Bundle 指的是什么？我知道Rollup的文档提到了treeshaking个，以帮助减少Bundle 包的大小，但却提到了Webpack also has a way of doing this个.也许我只是不完全理解这个概念.
请注意，这不是关于汇总和网页包的比较问题.对于对此感兴趣的人来说，这里有一个comparison chart for that by Webpack.这主要是问什么是扁平Bundle ？为了实现这一点，Rollup在内部做了什么？
Edit: Rollup supports code splitting - 100
Edit: Webpack now supports scope hoisting in some situations — 100
对于这类东西，我们可能都有不同的定义，但我认为扁平Bundle 只是意味着"将模块转换为单个Bundle 包"——也就是说，"扁平"是多余的.React 16的最大区别在于，默认情况下，你会使用一个预先制作的Bundle 包，而不是你的应用程序负责Bundle React的源模块(尽管总是有prebuilt UMD bundle of React available个，用Browserify构建).
相反，两者之间的最大区别在于发生了什么.webpack的工作方式是将每个模块包装在一个函数中，并创建一个实现加载程序和模块缓存的包.在运行时，依次计算这些模块函数中的每一个，以填充模块缓存.这种体系 struct 有很多优点——它可以实现代码拆分和按需加载以及热模块替换(HMR)等高级功能.
Rollup采用不同的方法——它将所有代码放在同一级别(根据需要重写标识符，以避免变量名之间的冲突等).这通常被称为"scope hoisting".因此，没有每个模块的开销，也没有每个包的开销.你的包一定会更小，而且判断速度也会更快，因为间接性更少(更多信息-The cost of small modules).取舍是，这种行为依赖于ES2015模块语义，这意味着webpack的一些高级功能更难实现(例如，Rollup不支持代码拆分，至少目前还不支持！).
简而言之，webpack generally更适合应用程序，而Rollup generally更适合库.
我已经凑了small gist illustrating the differences个.您还可以在tinkering with the Rollup REPL之前感受到Rollup的输出.