前端JS、CSS版本控制

产生的原因：

用户在浏览器浏览某个网页，浏览器在加载网页中包含的各个资源（JS、css、图片）时，先会判断缓存中是否已经包含了此资源（当然这与Header中定义的Cache-Control有关，静态资源很少有设置成不缓存的，我这里默认它们都是可缓存），如果包含，就不去服务器获取了。

普通处理方法：

每次更新前，在html文件内，将所有引用（URL）的JS和CSS文件名后面添加后缀?verson=20170927，如：Global.css?v=yyyyMMddv，虽然定位到的资源仍然是Global.css，但如果v的值不同，浏览器会认为是不同的资源。同理，对于JS、图片来说，也是如此。
==> 但这种手动的处理方法有缺点就是：当文件很多的时候，需要一个个添加，容易出错和耗时耗力。

Vue的处理方法：

找到build/webpack.prod.conf.js文件，可以看到
==>js文件：
output: {
path: config.build.assetsRoot,
filename: utils.assetsPath('js/[name].[chunkhash].js'),
chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
},
==>css文件：
new ExtractTextPlugin({
filename: utils.assetsPath('css/[name].[contenthash].css')
}),

js文件

css文件

index.html文件

关闭版本控制方法：
==>js文件：
output: {
path: config.build.assetsRoot,
filename: utils.assetsPath('js/[name].js'),
chunkFilename: utils.assetsPath('js/[id].js')
},
==>css文件：
new ExtractTextPlugin({
filename: utils.assetsPath('css/[name].css')
}),