vue第一此加载过长使用懒加载以及懒加载带来的Loading chunk {n} failed

最新推荐文章于 2024-04-27 04:49:00 发布

sust_ly

最新推荐文章于 2024-04-27 04:49:00 发布

阅读量472

点赞数

分类专栏： vue 文章标签： vue

本文链接：https://blog.csdn.net/pycharm_u/article/details/96110606

版权

vue 专栏收录该内容

9 篇文章

订阅专栏

1.解决第一次加载过长

 {path:"/",name: "homeLink",component:resolve => require(['@/components/Home.vue'],resolve)},
    {path:"/aboutWe",component:resolve => require(['@/components/AboutMe.vue'],resolve)},
    {path:"/login",name:"loginLink",component:resolve => require(['@/components/Login.vue'],resolve)},
    {path:"/register",name:"registerLink",component:resolve => require(['@/components/Register.vue'],resolve)},
    {path:"/hot",name:"hotLink",component:resolve => require(['@/components/Hot.vue'],resolve)},
    {path:"/crateArticle",component:resolve => require(['@/components/CreateArticle.vue'],resolve)},
    {path:"/articleManager",component:resolve => require(['@/components/ArticleManager.vue'],resolve)},
    {path:"/showArticle/:id",name:"showArticleLink",component:resolve => require(['@/components/ShowArticle.vue'],resolve)},
    {path:"/updateArticle",name:"updateArticleLink",component:resolve => require(['@/components/updateArticle.vue'],resolve)},
    {path:"/category/:cate", name:"categoryLink", component:resolve => require(['@/components/category.vue'],resolve)},
    {path:"/search/:search",name:"searchLink",component:resolve => require(['@/components/Search.vue'],resolve)},
    {path:"*",component:resolve => require(['@/components/Home.vue'],resolve)}

2.解决Loading chunk {n} failed

router.onError((error) => {
  const pattern = /Loading chunk (\d)+ failed/g;
  const isChunkLoadFailed = error.message.match(pattern);
  const targetPath = router.history.pending.fullPath;
  if(isChunkLoadFailed){
    router.replace(targetPath);
  }
});