vue 打包出现的缓存问题

vue 项目每一次打包上线，都会有浏览器缓存问题，需要用户手动清除缓存，十分麻烦

解决方案

1. 对编译打包文件增加时间戳

每次打包改变js的名称就OK了，在 ​​vue.config.js​​​ 下修改/添加出口 ​​output​​，通过时间戳命名使每次包的名称都不一样

• ​​vue-cli3​​ 中

const  Timestamp = new Date().getTime(); //时间戳

configureWebpack: {
  output: { 
     filename: 'js/[name].'+Timestamp+'.js',
     chunkFilename: 'js/[name].'+Timestamp+'.js'
  }
}

• ​​vue-cli2​​ 中

const  Timestamp = new Date().getTime();

output: {
    path: config.build.assetsRoot,
    filename: utils.assetsPath('js/[name].[chunkhash].'+Timestamp+'js'),
    chunkFilename: utils.assetsPath('js/[id].[chunkhash].'+Timestamp+'js')
}

2. meta设置不缓存

在 ​​index.html​​ 文件添加如下代码

<meta http-equiv="pragram" content="no-cache">
<meta http-equiv="cache-control" content="no-cache, no-store, must-revalidate">
<meta http-equiv="expires" content="0">