解决vue 报Loading chunk (\d)+ failed问题

最新推荐文章于 2026-02-27 14:07:23 发布

原创最新推荐文章于 2026-02-27 14:07:23 发布 · 926 阅读

3 ·

本内容遵循CC 4.0 BY-SA版权协议

收录于

前端

当前文章被收录于：

前端

9 篇文章 1 人学习

订阅专栏查看详情

当前文章被以下社区和专栏收录：

本文探讨了在前端开发中，使用router.onError处理加载chunk失败的情况。通过匹配错误信息判断是否为chunk加载失败，采用location.reload()而非router.replace避免死循环，确保页面正常刷新。

router.onError((error) => {
  const pattern = /Loading chunk (\d)+ failed/g;
  const isChunkLoadFailed = error.message.match(pattern);
  if (isChunkLoadFailed) {
    // 用路由的replace方法，并没有相当于F5刷新页面，失败的js文件并没有从新请求，会导致一直尝试replace页面导致死循环，
    //用 location.reload 方法，相当于触发F5刷新页面，虽然用户体验上来说会有刷新加载察觉，但不会导致页面卡死及死循环，从而解决该问题
    location.reload();
  }
});

标签

#vue.js