当前位置:首页 > 经验笔记 > VUE > 正文内容

vue 用webpack 打包的时候添加版本号, VUE 项目更新部署时,浏览器页面缓存问题

han32684年前 (2022-07-12)VUE7057

因浏览器缓存原因导致vue 打包的文件 导致偶尔会出现不能即使更新最新代码。因此在打包的文件名中添加一个版本号以便浏览器能区分。

module.exports = {
  //给js添加版本号
  configureWebpack:(config) => {
      config.output.filename = `static/js/[name].${version}.js`;
      config.output.chunkFilename = `static/js/[name].${version}.js`
  },
  //给css添加版本号
  chainWebpack: config => {
       // 清除css,js版本号
       // config.output.filename('static/js/[name].js').end();
       // config.output.chunkFilename('static/js/[name].js').end();
       // 为生产环境修改配置...
       config.plugin('extract-css').tap(args => [{
            filename: `static/css/[name].${version}.css`,
            chunkFilename: `static/css/[name].${version}.css`
       }])
  }
...
}


标签: VUE

相关文章

VUE computed和watch的区别最简化

VUE computed和watch的区别最简化

<!DOCTYPE html> <html lang="en"> <head>    &...

element-ui Tree 树形控件实现单选 最简方法VUE

做项目时需要用到Tree树形控件单选但是Tree组件没有单选设置,网上找了几个方法不太适应,看了官网文档发现很简单 代码如下      &n...

vue中$set的使用踩坑日记

vue中$set的使用踩坑日记

1、为什么要用set?在vue中,并不是任何时候数据都是双向绑定的。在官方文档中,有这样一段话,如下:从文档得知,当数据没有被双向绑定的时候,我们就需要使用set了2、set用法解决数据没有被双向绑定...

vue跳转时打开新窗口的方法

    1、<vue-link>标签实现新窗口打开    官方文档中说 v-link 指令被 <rou...

vue引入本地json数据文件

    data() {         return {...