webpack 3 合并 chunk 巨慢无比

[slucus]

项目越来越大，使用 webpack 打出来的 chunk 高达 400 多个，为了优化请求数量，使用 webpack.optimize.LimitChunkCountPlugin 将 chunk 控制在了 12 个，但这样造成了一个问题，每次打包花在这上面的时间居然要将近 40 分钟。。。。

找了一圈也没有什么好的替代方案，各位大佬，有什么建议么？[抱拳了]

[noe132]

40 分钟是真的 niupi。

几个建议
升级 webpack4
使用 speed-measure-webpack-plugin 看看到底哪个 loader 慢
使用 webpack-bundle-analyzer 看看那些 module 是不需要的
是否使用了 import()而且使用的是非静态字符串，如 import(`path/${folder}/hi.js`)

[silaike]

exclude node_modules 了吗

[slucus]

现在问题已经定位到了。就是因为项目比较大，当时设计的时候为了后续维护方便，拆分了较多的 components，所以导致打包出来了 400 多个 js。。。

然后问题来了，当我们使用 webpack.optimize.LimitChunkCountPlugin 进行 js 合并的时候，就变动巨慢无比，想找个多进程的合并方法，但目前网上好像也没有这块相关的问题

[slucus]

@noe132 升级也考虑过，但成本太大了，而且会有额外的风险( 因为现在项目已经上线了 )

[slucus]

这个问题基本上算是解决了。
原因：使用了 import 的方式注册组件 ` () => import() `，使用这种方式，在打包的时候，会把组件打成单独的文件。项目初期这样是没什么问题的，但项目越来越大，组件越来越多。所以就会打出几百个单独的文件，但为了做请求优化，又要把这个几百个文件合并成 10 个左右，所以打包速度成倍增长。

解决方法：使用 require 注册组件。