当前位置: 首页 > news >正文

vue报错:Loading chunk * failed,vue-router懒加载出错问题。

目录

    • 一、 出现场景
    • 二、 解决方案


一、 出现场景

菜单路由跳转时,有时页面会卡死,无法进行路由跳转
在这里插入图片描述

二、 解决方案

修改src目录下permission.js文件

router.onError((error) => {const jsPattern = /Loading chunk (\S)+ failed/gconst cssPattern = /Loading CSS chunk (\S)+ failed/gconst isChunkLoadFailed = error.message.match(jsPattern || cssPattern)const targetPath = router.history.pending.fullPathif (isChunkLoadFailed) {localStorage.setItem('targetPath', targetPath)window.location.reload()}
})router.onReady(() => {const targetPath = localStorage.getItem('targetPath')const tryReload = localStorage.getItem('tryReload')if (targetPath) {localStorage.removeItem('targetPath')if (!tryReload) {router.replace(targetPath)localStorage.setItem('tryReload', true)} else {localStorage.removeItem('tryReload')}}
})

相关文章:

  • 马克·雷伯特:用算法让机器人飞奔的人
  • 十一、引用与拷贝函数(References the Copy-Constructor)
  • 节流和防抖
  • 盒子模型
  • 在idea开发中遇到的20个bug
  • WINCC短信报警解决方案
  • 优先队列和单调队列(双端队列实现的)
  • 美团社招一面
  • 每日c/c++题 备战蓝桥杯(P1093 [NOIP 2007 普及组] 奖学金)
  • 7、langChain和RAG实战:基于LangChain和RAG的常用案例实战
  • echarts+标签+指引线
  • 亚马逊低价商城战略全解析:跨境卖家突围价格战的7维作战体系
  • 零基础制作Freertos智能小车(教程非常简易)持续更新中....
  • 深入解析 PyTorch 中的 torch.distributions模块与 Categorical分布
  • 【深入理解指针(6)】
  • 剑指offer经典题目(七)
  • 深入蜂窝物联网:第二章 深度解读 NB-IoT:协议栈、部署与典型应用
  • echarts自定义图表--仪表盘
  • 网络》》ARP、NAT
  • 【KWDB 创作者计划】_企业数据管理的利刃:技术剖析与应用实践
  • 再现五千多年前“古国时代”:凌家滩遗址博物馆今开馆
  • 多地举办演唱会等吸引游客刺激消费,经济日报:引导粉丝经济理性健康发展
  • 俄外交部:俄乌伊斯坦布尔谈判改在当地时间15日下午举行
  • 张广智︱“编年事辑”:打开学人心路历程的窗户
  • 回望星河深处,唤醒文物记忆——读《发现武王墩》
  • 明查| 新一代AI诊疗系统可3秒筛查13种癌症?没有证据