github仓库
最近项目打包升级，将老的gulp换成webpack,然后很轻松的，增加多入口，增加rules,增加plugins好像万事大吉了。详细介绍如何一步一步自建一个多页面的webpack,然后，由于我们是老项目，按这样打包没什么一丁点问题，然后，再开发环境，新建项目，写项目，然后发现hmr热更新发现 ，竟然要10多秒，天呐，而且发现在js里写的class竟然没打包过去。
下面就来谈谈我是怎么解决这些坑的。
1.打包后js里操作的class样式，竟然没打包到css,原因是我用了purifycss-webpack（消除冗余的css代码），但是没有忽略了扫描js源代码。这个插件确实好用哦，推荐❤️❤️❤️
2.为什么打包后，和开发环境不一样，因为开发环境没配置抽离css，所以就不会走纯净css这些插件（为了开发环境打包速度），所以需要再加个打包后的代理服务器，可以随时查看效果，改bug啊，所以又新加了script/pro.js脚本
3.最重要的，开发环境热更新要10多秒，其实多入口，webpack还是要重新打包所有入口的文件，即使你那个页面没变动，造成时间久的原因是我们devtool:用了source-map，比较耗时间，再改过配置devtool: '#cheap-module-eval-source-map'，时间快了些，8秒左右吧，然后看了html-webpack-plugin配置hash: true,好像也快了些，但是不明显。但是不是治根，现在页面才30个不到，然后再考虑要不要再抽离一个但页面入口的webpack配置，即开发的当前页面，但想着还要复制黏贴，写不同但脚本，想想麻烦（懒啊），这时候有再webpack官网看了下，竟然支持动态入口配置，so so 找到了一种比较靠谱的优化方式。文档，
简单的说就返回个promise对象。想着开发环境处理与生产有很多不同，so把开发和生产webpack分离，毕竟生产不需要动态。具体代码
entry: () => new Promise((resolve) => resolve(webpackConf.webpackEntrys())),webpackEntrys函数
getAppEntry函数
entrys和commonEntry
此处遇到一个坑，刚开始是传给是数组，结果整合成1个main.js不符合需求，后面改写对象传入。
注：
entry为空，则为打包所有页面，为单独string可以设置具体单独打包的页面，其实也可以传想要打包的数组
这个是开发者个人的配置，git设置忽略
config/self.config.js
module.exports = { entry: "test", env: "", cookie: "", devBaseUrl: ""}
