vue懶加載,打包后項目出現(xiàn)“Loading chunk 0 failed”

這個困擾我很久的問題,今天總算解決了,長長地舒了一口氣呀,于是寫下這篇文章,希望給一些同道中人提供些許思路和幫助。

最近弄項目優(yōu)化,路由懶加載成了首要任務,因為項目首頁加載app.js和vendor.js太大了,于是乎我就弄了懶加載。

打包到測試環(huán)境一看,頁面白屏了,控制臺出現(xiàn)了如下報錯:


8781ed4fd9a0603c8575aae3aa05d38.png

第一次看見這個報錯,我就去搜索Loading chunk 0 failed
結(jié)果就是網(wǎng)上文章,要不就是說放棄懶加載,要不就是加個路由router.onError進行監(jiān)聽,監(jiān)聽有問題之后刷新頁面,我覺得這些都沒解決本質(zhì)問題,而且我的情況是即使刷新頁面也是加載失敗,反正我就各種嘗試,其中艱辛不說了,到最后思維已經(jīng)進入了僵局,找不到突破口......

現(xiàn)在想想,其實是我的思路有問題,報錯信息很明顯說了failed to resolve async component default: Error Loading chunk 0 failed也就是說加載不到異步組件,所以報錯,而無法加載到對應組件的js,原因只有一個,那就是路徑問題,導致加載不到。

然后我看了下控制臺加載的js,路徑也確實不對,因為我的是測試環(huán)境,所以域名后面應該有個test,而控制臺加載的js,直接就是線上地址

1655263061328.png

然后我就修改config.js文件里面的assetsPublicPath,改為/,網(wǎng)上很多人說有效果,但是我試了沒有用
于是乎,我就試了第二種方法,因為我是測試環(huán)境懶加載引入的js文件路徑有問題,于是我就是修改webpack.test.conf.js,把publicPath從絕對路徑/改為相對路徑./

問題就這么解決了,解決之后,回想自己為了解決這個問題,做了各種很蠢的嘗試,各種百度搜索,甚至最后都有一種死馬當活馬醫(yī)的心態(tài),歸根到底,是我自己思路沒有理清,采取錯誤的方法進行錯誤的嘗試導致的,浪費許多時間和精力,這里我得檢討一下自己:思路是最重要的,不要為了解決問題而變得很盲目被動,要通過現(xiàn)象看透本質(zhì),對癥下藥,方能藥到病除,死馬當活馬醫(yī)終歸是行不通的,加油吧,路漫漫其修遠兮,吾將上下而求索。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容