webpack rebuild 速度太慢

工程的开发环境使用express+webpack-dev-middleware+webpack-hot-middleware,热加载+网页的错误提示开发起来很爽。

之前webpack每次启动的build速度都比较慢,后来参照这篇文章做了优化:
开发工具心得:如何 10 倍提高你的 Webpack 构建效率
加上dll plugin和happypack等之后,构建速度一下子由120s缩短到30s以内,随着工程越来越大(12万业务代码),rebuild速度越来越慢,现在一次rebuild速度大概得12s左右,实在是不能忍受。

哪位有这方面优化经验的,还请不吝赐教。

阅读 6.1k
2 个回答

There are quite a few conditions that can contribute to slowness. From personal experience, I have found that the best way about trying to solve it, is to Measure, Profile, and Diagnose the issue first.

When you run webpack, instead run it with node and the following flags:

node --inspect --debug-brk ./node_modules/webpack/bin/webpack.js

Then open up Chrome Browser and goto chrome://inspect and click 'Open Dedicated Node Debugger'.

This will give you debug, breakpoint, and profiling features that you can use to measure and analyze what functions and areas of webpack are taking the longest. Once you have found that out, you can start to determine exactly what is causing the issue. Here is a great post (although a little outdated for the instructions), that shows how these steps might look like

If this doesn't help, then you can try other webpack build features like DllPlugin, using devtool: 'eval-source-map', look for specific loaders that have caching features, as well as our new cache-loader.

恩。。。干掉了五十多个目录,rebuild速度变成了6s。(目录里面就一个index+几行代码,作为一个简单隔离)原来目录对rebuild速度影响这么大啊。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏