vue打包添加版本号或时间戳，实现更新项目自动清除缓存

本来vue打包会自动实现hash来解决缓存问题，但是在部分浏览器没有自动更新到，我这边在微信打开遇到这问题。

默认自动打开的格式类似这样子：

[name].[contenthash].css

 

 

 

然而我想要的格式是

[name].[contenthash].css?t=${Timestamp}

通过后面t=xxxx的不同从而实现自动重新加载文件，保持最新的界面。

 

在使用webpack打包的情况下：

在目录：build/webpack.xxx.conf.js文件

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

output: {
    path: config.build.assetsRoot,
    filename: utils.assetsPath(`js/[name].[chunkhash].${Timestamp}.js?t=${Timestamp}`),
    chunkFilename: utils.assetsPath(`js/[id].[chunkhash].${Timestamp}.js?t=${Timestamp}`)
  },

new ExtractTextPlugin({
      filename: utils.assetsPath(`css/[name].[contenthash].css?t=${Timestamp}`),
      allChunks: true,
    }),

 

在使用vueCli情况下：

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

chainWebpack(config) {
    // config.output.filename(`static/js/[name].[contenthash].js?v=${Timestamp}`).end()
    config.output.chunkFilename(`static/js/[name].[contenthash].js?t=${Timestamp}`).end()
    config.plugin('extract-css').tap(args => [{
      filename: `static/css/[name].[contenthash].css?t=${Timestamp}`,
      chunkFilename: `static/css/[name].[contenthash].css?t=${Timestamp}`
    }])
  },

因为项目使用了懒加载理由，所有chunk_xxx的文件，所有没有使用第一句（已注释）。