vue報錯：Loading chunk * failed，vue-router懶加載出錯問題。

在改一個項目的過程中，與到一個問題，route.push()的時候報錯：Loading chunk * failed。在網上找了一大堆解決辦法，雖然沒有直接的解決問題，但還是得到了一些啓發。

作者這裏提供了三種解決方式：

一、不用懶加載，直接使用組件

import Foo from "@/views/foo"

const router = new VueRouter({
  routes: [
    { path: '/foo', component: Foo }
  ]
})

 

二、繼續使用懶加載，但是在需要在路由發生錯誤時做一些處理。

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);
  }
});

傳送門：https://blog.csdn.net/zhongguohaoshaonian/article/details/95179057

三、檢查是否是vue.config.js配置問題

由於之前打包生產環境時爲解決靜態資源訪問的問題，在vue.config.js中配置了publicPath變量，改回如下即可：

module.exports = {
    publicPath: "/"
}

具體情況需要根據實際遇到的問題來解決，這裏只是提供一些思路。