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

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

han32683年前 (2022-07-12)VUE5443

因浏览器缓存原因导致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`
       }])
  }
...
}


扫描二维码推送至手机访问。

版权声明:本文由瀚文博客发布,如需转载请注明出处。

本文链接:https://www.hanwenblog.com/post/68.html

分享给朋友:

相关文章

vue强制更新$forceUpdate()

vue强制更新$forceUpdate()

vue强制更新$forceUpdate()添加this.$forceUpdate();进行强制渲染,效果实现。搜索资料得出结果:因为数据层次太多,render函数没有自动更新,需手动强制刷新。调用强制...

基于vue的移动端图片裁剪压缩处理

效果展示:原作者介绍:传送门原作者github:传送门基于原作者封装的组件:传送门基于原作者+vant UI封装的组件:传送门...

vue引入本地json数据文件

    data() {         return {...

element中el-switch开关点击弹出确认框 阻止默认的el-switch 的点击事件 发送请求成功后才改变状态

element中el-switch开关点击弹出确认框 阻止默认的el-switch 的点击事件 发送请求成功后才改变状态

Switch 开关表示两种相互对立的状态间的切换,多用于触发「开/关」。常见用法: 1、绑定v-model到一个Boolean类型的变量。可以使用active-color属性与inactiv...

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

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