vue部署后客户端强制刷新获取最新代码资源[纯前端]

背景：在自己的项目中修复了bug；但是客户端没有刷新浏览器；导致错误的资源代码；有个问题思路：结合vue部署后如何强制客户端刷新获取最新的代码资源？里面的解决方案；生产环境部署后实现资源刷新的3个步骤1.在vue项目中的package.json中创建一个对比文件，用来存放当前打包资源的当前版本号，并将最新的版本号放在jsonversion.json中（以这个为准）;将webpack放在public文件中进行打包编译；并维护一个辅助字段must，表示是否必须强制刷新；当前的默认错误级别将强制刷新；优化和新增功能无需强制刷新2.在公共组件或全局方法中获取对比文件；创建一个10秒的轮询计时器来轮询version.json文件；并与本地资源的package.json进行对比；我把它放在layout.vue组件中；因为登录页面除外；其他页面安装在布局内；所以也可以理解为全局组件。获取系统中两个版本的最新版本（使用axios.get获取；注意：设置axios不去缓存）输出效果3.开始比较，后续逻辑在created函数中layout.vue组件；每10秒开启一个轮询请求；目的是比较新旧版本号是否一致，是否需要刷新；是否满足刷新要求；然后开始交互式刷新（用户可能正在提交表单或保存重要信息）；所以给用户一个刷新流程，提示他刷新//刷新逻辑reloadNotifier(){lettime=20constkey=`open${Date.now()}`this.$notification.open({message:'Systemprompt',description:`系统版本已更新，请尽快保存当前信息！浏览器将在${time}秒后刷新！`,duration:null,icon:,closeIcon:,btn:h=>{returnh('a-button',{props:{type:'primary'},on:{click:()=>window.location.reload()}},'Refreshnow');},key})//动态修改倒计时this.notificationTimer=setInterval(()=>{time--if(time<1){window.location.reload()clearInterval(this.notificationTimer)this.$notification.close(key)}this.$notification.open({message:'系统提示',description:`系统版本已更新，请尽快保存当前信息！${time}秒后刷新浏览器！`，持续时间：null，图标：，closeIcon：，btn：h=>{returnh('a-button',{props:{type:'primary'},on:{click:()=>window.location.reload()}},'立即刷新');},钥匙}）;},1000)}显示效果写在最后：这个方案的成本比较小；无需后端配合即可完成；未来迭代中的可扩展性也很丰富