前言: 項(xiàng)目使用vue-cli版本2.9.3 ,vue-router使用webpackChunkName
實(shí)現(xiàn)按需加載.
創(chuàng)新互聯(lián)主要從事網(wǎng)站設(shè)計(jì)、成都網(wǎng)站建設(shè)、網(wǎng)頁設(shè)計(jì)、企業(yè)做網(wǎng)站、公司建網(wǎng)站等業(yè)務(wù)。立足成都服務(wù)常山,10余年網(wǎng)站建設(shè)經(jīng)驗(yàn),價(jià)格優(yōu)惠、服務(wù)專業(yè),歡迎來電咨詢建站服務(wù):18980820575
BUG描述:該報(bào)錯在項(xiàng)目上線一段時(shí)間后,有用戶反映頁面無法正常游覽 (后面以問題1/問題2區(qū)分)
問題1.導(dǎo)航點(diǎn)擊無法正常跳轉(zhuǎn),console打印:Error:Loading chunk {n} failed.
報(bào)錯截圖
問題2.頁面全白,console打印:Uncaught SyntaxError:Unexpected token <
報(bào)錯截圖:
經(jīng)過一番折騰,初步定位問題1在經(jīng)過build/webpack.prod.conf.js
的chunkhash
打包后的JS文件hash值會有變更,因?yàn)槊看胃麓a到線上都會刪除舊的dist目錄,將最新的dist目錄copy上傳提供后臺更新. 在更新代碼的這個過程用戶停留在頁面上,當(dāng)用戶在更新完后重新操作就會導(dǎo)致報(bào)錯
問題1解決方法:捕獲路由報(bào)錯. (思路來源:https://www.jb51.net/article/147427.htm)
routers.onError((err) => { const pattern = /Loading chunk (\d)+ failed/g; const isChunkLoadFailed = err.message.match(pattern); if (isChunkLoadFailed) { let chunkBool = sessionStorage.getItem('chunkError'); let nowTimes = Date.now(); if (chunkBool === null || chunkBool && nowTimes - parseInt(chunkBool) > 60000) {//路由跳轉(zhuǎn)報(bào)錯,href手動跳轉(zhuǎn) sessionStorage.setItem('chunkError', 'reload'); const targetPath = routers.history.pending.fullPath; window.location.href = window.location.origin + targetPath; }else if(chunkBool === 'reload'){ //手動跳轉(zhuǎn)后依然報(bào)錯,強(qiáng)制刷新 sessionStorage.setItem('chunkError', Date.now()); window.location.reload(true); } } })
問題2在Network查看js文件加載的時(shí)候發(fā)現(xiàn)某個js文件Response Header
content-type異常,正常情況返回content-type: application/javascript
. 但是有一個js響應(yīng)的內(nèi)容為HTML, js無法識別<符號導(dǎo)致拋出報(bào)錯
問題2目前還在與后臺商量如何解決,解決后會更新解決方法分享.有同學(xué)遇到同樣的問題可以一起討論或提出更好的解決方案參考學(xué)習(xí).★★★
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持創(chuàng)新互聯(lián)。
本文名稱:vue-cli打包后提交到線上出現(xiàn)"UncaughtSyntaxError:Unexpectedtoken"報(bào)錯
瀏覽路徑:http://muchs.cn/article34/ijdjpe.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供外貿(mào)建站、網(wǎng)站營銷、網(wǎng)站建設(shè)、響應(yīng)式網(wǎng)站、App設(shè)計(jì)、關(guān)鍵詞優(yōu)化
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)