vue打包部署，解决更新版本清理缓存问题

发布时间：2023-07-06 16:14:10 修改时间：2023-07-06 16:14:10 阅读：1180 评论：0 0

一、根目录index.html

在head标签中，加入下面的代码

<meta http-equiv="pragram" content="no-cache">

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

二、配置vue.config.js （module.exports里）

动态生成文件名

//顶部设置变量 

const Timestamp= new Date().getTime()

configureWebpack: { // js 配置

    output: { // 输出重构  打包编译后的 文件名称

      filename: `static/js/[name].${process.env.VUE_APP_Version}.${Timestamp}.js`,

      chunkFilename: `static/js/[name].${process.env.VUE_APP_Version}.${Timestamp}.js`

    },

  },

  css: { // css 配置

    extract: {

      // 修改打包后css文件名   

      filename: `css/[name].${Timestamp}.css`,

      chunkFilename: `css/[name].${Timestamp}.css`

    }

  },

注：如果在文件中没有以上配置项，添加进去，路径可根据自己项目中的路径调整，主要是文件名部分

---