关于react项目打包时间太长的优化

最近在弄公司的老项目，这个项目是之前我自己搭建的，由于当时react不是很熟练，也没有独自搭建大型react项目的经验，只能照葫芦画瓢搭起了一个项目，然而随着业务的复杂，每次启动项目都要等好几分钟，项目打包上线也要200多秒，最近终于想把这个问题彻底解决一下，于是查看打包后的文件发现有30M，这也太大了。进去build目录，看到里面有一个map文件很大，肯定是这里出了问题，查阅资料得知，map文件是webpack的在devtool的sourceMap中配置的，便于定位错误的问题。于是在webpack.config.js中增加了GENERATE_SOURCEMAP=false这个环节变量，在生产环境中去掉了生成的map文件。
然后我又重新进行了打包操作，发现包的体积确实变小了，成了5点多M，然而打包时间却并没什么变化，不行，还得继续搞，看了一些文章，说是配置dll可以把第三方包单独打包成一个模块，下次不用再打包这些第三方库，这样就大大节省了打包时间，然而，dll的配置却异常的繁琐，查询了其他的文章，最后发现hard-source-webpack-plugin这个插件，配置更简单

const HardSourceWebpackPlugin = require('hard-source-webpack-plugin');

module.exports = {
  // ......
  plugins: [
    new HardSourceWebpackPlugin() // <- 直接加入这行代码就行
  ]
}

只需上面几行代码，然后打包测试，第一次打包有原来的200S变成了45S，然后有执行了一次变成了15S，速度提升了好多倍

参考文章

eact 脚手架 打包生成map文件 体积过大

辛辛苦苦学会的 webpack dll 配置，可能已经过时了