专业网站制作 广州番禺营销型网站建设公司

问题描述:

使用Vite打包构建的项目，重新部署到生产。在部署期间用户一直停留在当前项目页面（长时间无操作 半个小时+），部署完成后点击页面上的路由，报错！
刷新后恢复正常。

出现问题原因：

上线打包的自动化工具会把上一个版本的资源文件清空，vite打包发版后，当前页面缓存的还是发版之前的资源，未主动刷新成新资源，导致点击页面路由跳转页面时在服务器上找不到之前的包，从而在页面上面显示为 点击切换菜单路由，页面没有任何变化，F12打开控制台发现报错，如上图所示：

如何解决问题：

	在router.js页面新增，路由报错捕获，监听到报错信息包含 “ Failed to fetch dynamically imported module ”，就自动刷新页面

router.onError(error => {if (error.message.includes("Failed to fetch dynamically imported module")) {window.location.reload();}
});