webpack打包生成多个vendor的配置方法
http://blog.163.com/sdhhqb@126/blog/static/637055372016628828964/
用webpack打包项目的时候，一般喜欢把一些公用的库打包的vendor.js里面，比如像react，react-router，redux等。
随着引入的库越来越多，vendor文件也变得越来越大，于是考虑打包成两个vendor，把和react相关的库打包成一个vendor，其他的库打包成另外一个vendor。按照webpack的文档开始配置，需要注意有两个比较坑的地方。
参考配置：
...
entry: {
"vendor1": ["react", "react-dom", "react-router", "react-router-redux", "react-redux", "redux"],
"vendor2": ["crypto-js", "fastclick"], "app": "./js/index.js"
},
...
plugins: [
new webpack.optimize.CommonsChunkPlugin({
names: ["vendor2","vendor1"],
minChunks: Infinity
})
],
...
第一个要注意的地方，在CommonsChunkPlugin里面，vender的顺序要反着来，总之，要和加载顺序相反。比如你想按vendor1，vendor2的顺序加载，entry里面写的是vendor1，vendor2，在CommonsChunkPlugin里面要写vendor2，vendor1。
第二个要注意的地方，output.filename一定不要写死了，要配置成可替换的，类似filename: '[name].js'形式。
参考链接：
https://github.com/webpack/webpack/tree/master/examples/two-explicit-vendor-chunks
- 上一篇 »webpack务虚扫盲
- 下一篇 »学习webpack4 自动化生成项目的html，下
