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()
}
相关推荐
疯狂的沙粒6 小时前
Vue 前端大屏做多端屏幕适配时,如何让其自动适配多种不同尺寸的屏幕?
前端·javascript·vue.js
范小多6 小时前
24小时学会Python Visual code +Python Playwright通过谷歌浏览器取控件元素(连载、十一)
服务器·前端·python
ooolmf6 小时前
matlab2024读取温度01
java·前端·javascript
打工人小夏6 小时前
前端vue3项目使用nprogress动画组件,实现页面加载动画
前端
一颗宁檬不酸6 小时前
前端农业商城中产品产地溯源功能的实现
前端
李少兄6 小时前
深入理解前端中的透视(Perspective)
前端·css
江公望6 小时前
HTML5 History 模式 5分钟讲清楚
前端·html·html5
云和数据.ChenGuang7 小时前
Zabbix Web 界面安装时**无法自动创建配置文件 `zabbix.conf.php`** 的问题
前端·zabbix·运维技术·数据库运维工程师·运维教程
码界奇点7 小时前
Java Web学习 第15篇jQuery万字长文详解从入门到实战解锁前端交互新境界
java·前端·学习·jquery
前端老曹7 小时前
vue3 三级路由无法缓存的终极解决方案
前端·javascript·vue.js·vue