vue+vite根据版本号清空用户浏览器缓存

项目生产环境发布新版本之后,用户可能会因为一些本地缓存的数据不一样而导致页面报错。这时候可以根据版本号去清空用户缓存。

1、在package.json文件中有一个管理版本号属性:version,在每次打包部署之前修改当前版本号。

2、在main.js文件中,加入版本号的判断逻辑,版本号不一致就重新加载,代码如下:

javascript 复制代码
//根据版本号清空用户缓存
import {version} from '../package.json';
const VUE_APP_VERSION = version
const vers = window.localStorage.getItem("Version");
if (VUE_APP_VERSION != vers) {
    localStorage.clear();
    sessionStorage.clear();
    Cookies.remove("token");
    window.localStorage.setItem("Version", VUE_APP_VERSION);
    location.reload()
}
相关推荐
LYFlied16 小时前
在AI时代,前端开发者如何构建全栈开发视野与核心竞争力
前端·人工智能·后端·ai·全栈
用户479492835691516 小时前
我只是给Typescript提个 typo PR,为什么还要签协议?
前端·后端·开源
馬致远16 小时前
Vue -组件入门
javascript·vue.js·ecmascript
程序员爱钓鱼16 小时前
Next.js SSR 项目生产部署全攻略
前端·next.js·trae
程序员爱钓鱼16 小时前
使用Git 实现Hugo热更新部署方案(零停机、自动上线)
前端·next.js·trae
潮流coder17 小时前
vscode修改缓存保存路径
ide·vscode·缓存
颜颜yan_17 小时前
DevUI + Vue 3 入门实战教程:从零构建AI对话应用
前端·vue.js·人工智能
国服第二切图仔18 小时前
DevUI Design中后台产品开源前端解决方案之Carousel 走马灯组件使用指南
前端·开源
无限大618 小时前
为什么浏览器能看懂网页代码?——从HTML到渲染引擎的奇幻之旅
前端
福尔摩斯张18 小时前
Linux信号捕捉特性详解:从基础到高级实践(超详细)
linux·运维·服务器·c语言·前端·驱动开发·microsoft