其他分享
首页 > 其他分享> > vue项目重新部署后导致部署前打开的页面跳转其他路由无效失败

vue项目重新部署后导致部署前打开的页面跳转其他路由无效失败

作者:互联网

分析原因

vue打包后js文件会带有hash值,重新部署后,之前js替换为最新打包的js,就导致切换路由等一些需要引入项目打包拆分出来的js文件时会请求不到资源,导致跳转失效等问题。

解决办法

1.监听js文件是否引入失败,失败后重新刷新页面(window.reload或者location.href到要跳转的路由地址(通过router.beforeEach可以设置到全局)),这样js文件引入就会是最新的地址。

window.addEventListener('error', (error) => { if ( !/SyntaxError/gi.test(error.message) || !/\/static_pc\/js\/\w+\.\w+\.js$/.test(error.filename) || !window.navigator.onLine ) { return } console.warn('检测到有新版本发布, 自动刷新页面', error);  // autoRefreshFullpath为router.beforeEach里面拿到的to.fullpath // location.reload() location.href = window.autoRefreshFullpath }) 不同浏览器的报错不同,我只针对chrome和火狐做了判断。 如果有其他的解决方法,请指教!!

 

 

标签:vue,跳转,js,重新部署,window,location,error,路由
来源: https://www.cnblogs.com/zerofan/p/14668317.html