webpack提取公共的

用了这么久的webpack，最开始的一通全部打包进一个文件

module.exports = {entry: './app.js'}

发现这样无法利用缓存，只要一修改代码，hash肯定会变，客户端缓存的文件就没意义了，就得全部reload。

于是再次查阅webpack，找到了CommonsChunkPlugin的插件，这下好了，可以把公共第三方模块提出来了，于是变成了

module.exports = {entry: {app: './app.js',vendor: ['vue', 'vuex', 'axios' /*等等其他的模块*/]},//其他配置plugins: [new webpack.optimize.CommonsChunkPlugin({            name: 'vendor'        })]}

打包后会多出一个vendor.[chunkHash].js的文件，大致查看内容，不错，已经把第三方库给分离开了

然而并没有什么卵用

vendor的hash在每次不管修改哪个文件后重新打包其实都在变化的，原来当初把vendor搞出来，只是提出了公共模块，但只要一发布版本，hash肯定变了，对缓存没有半毛钱的作用

再次拜读文档，更改为

module.exports = {entry: {app: './app.js',vendor: ['vue', 'vuex', 'axios' /*等等其他的模块*/]},//其他配置plugins: [new webpack.optimize.CommonsChunkPlugin({            names: ['vendor', 'init']        })]}

打包后，会多出个init文件，但我们需要的vendor的hash值没有改变，这样才是我要的正确打开方式

上图

配置参数

var CommonsChunkPlugin = require("webpack/lib/optimize/CommonsChunkPlugin");

new CommonsChunkPlugin({ names:['vendor','init'], minChunks:2  //加载至少2次的模块都提取})