Vue打包资源按时间戳方式

问题:

   由于默认的Vue打包是基于资源文件的hash模式,但是由于浏览器缓存,在实际发版过程中会出现引用老版本的问题。

解决:

   修改Vue资源打包,在资源文件后加上打包时间戳,以保证每次发版后,所有资源均为最新,避免缓存引用问题,尽管牺牲掉发版后文件加载的效能问题,但是也解决了潜在的缓存问题。

修改:

    修改“vue.config.js”文件配置:

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

module.exports = {

.......

  css: {
    extract: {
      filename: `css/[name].${Timestamp}.css`,
      chunkFilename: `css/[name].${Timestamp}.css`
    }
  },
  chainWebpack: config => {
    config.output.filename(`js/[name].${Timestamp}.js`)
    config.output.chunkFilename(`js/[name].${Timestamp}.js`)

.......

你可能感兴趣的:(Vue,css,vue.js,html,前端)