vue修改打包上传后浏览器缓存

vue缓存还是蛮大的，如果不刷新的话，而且这次刷新了下次重新进来还是会显示刷新之前的内容，是不是很坑啊。那么如何解决呢，其实很简单的
1、在项目根目录中找到bulid文件夹，找到webpack.prod.conf.js，也不要忘了找到webpack.testqa.conf.js，前面的是线上打包的处理文件，后面的是测试地址打包的处理文件，一并改了吧
2、修改文件

const version = new Date().getTime(); //1.定义变量， 这里使用的是时间戳 来区分 

//2.修改要生成的js和css文件的配置项，把刚刚声明的版本拼接进要生成的文件名中
output: {
    path: config.build.assetsRoot,
    filename: utils.assetsPath('js/[name].[chunkhash].' + version + '.js'),//清缓存，需要修改的地方
    chunkFilename: utils.assetsPath('js/[id].[chunkhash].' + version + '.js')//清缓存，需要修改的地方
},

//3.html 页面加载脚本的时候给脚本后面加一个时间戳
new HtmlWebpackPlugin({
	  filename: config.build.index,
	  template: 'index.html',
	  inject: true,
	  hash: version,//清缓存，需要添加的地方
	  minify: {
	    removeComments: true,
	    collapseWhitespace: true,
	    removeAttributeQuotes: true
	    // more options:
	    // https://github.com/kangax/html-minifier#options-quick-reference
	  },
	  // necessary to consistently work with multiple chunks via CommonsChunkPlugin
	  chunksSortMode: 'dependency'
}),

到这里就完成了，如果不确定是否设置成功，那么npm run build(线上打包)一下，如果项目根目录下的dist下面的prod文件夹(线上打包生成的文件夹)下面的index.html里面的js带上?xxxxxxxxxx就说明成功了。
这里是以线上打包处理为例，测试地址打包处理方法是一样的。

另清除缓存还可以在html头添加不缓存的meta 标签，不过个人不太建议，因为这样浏览器就没有一点缓存了，用户每次进来都要重新加载所有数据，即使我们开发人员什么都没有修改，当然如果有需要的话，可以设置一下，附上代码

//在项目根目录中找到index.html，添加下面代码
<meta http-equiv="pragram" content="no-cache">
<meta http-equiv="cache-control" content="no-cache, no-store, must-revalidate">
<meta name="viewport" content="width=device-width,initial-scale=1.0">