new webpack.optimize.ModuleConcatenationPlugin()到底有什么用？该怎么用？

Question

这个方法是webpack3新的特性，
解释是启用作用域提升，
作用是让代码文件更小、运行的更快

我设置了在dev和prod环境中都会用到它

可是，亲测下来对比了一下，发现跟没用这个特性的时候，js和css的文件大小并没什么变化。。。

请问这个特性到底有啥用？该怎么用？

Answer 1

我感觉目前作用不大，大部分库都没有使用 es 的语法，除了那些 demo 可以实现作用域提升外，我还真没有在任何实际项目中提升成功过。

不过 es module 是未来。

编译时加命令行参数 --display-optimization-bailout 看一下到底是什么阻止了这个插件。

Answer 2

webpack 3 有的特性，一直没有太普及出去，感觉还是包体积作用不大

Answer 3

这个插件的应用范围是ES6语法的模块，如果是用的CMD/AMD等非ES6语法的话，这个插件是没办法起到优化的作用

Answer 4

过去 webpack 打包时的一个取舍是将 bundle 中各个模块单独打包成闭包。这些打包函数使你的 JavaScript 在浏览器中处理的更慢。相比之下，一些工具像 Closure Compiler 和 RollupJS 可以提升(hoist)或者预编译所有模块到一个闭包中，提升你的代码在浏览器中的执行速度。

这个插件会在 webpack 中实现以上的预编译功能。https://webpack.docschina.org...