項(xiàng)目環(huán)境:
vue3.2.13
vue-cli5.0.0
注:該問(wèn)題只是出現(xiàn)在開發(fā)環(huán)境,打包后是不會(huì)出現(xiàn)的。
問(wèn)題描述:
由于需要新開一個(gè)開發(fā)項(xiàng)目,引入必備網(wǎng)絡(luò)請(qǐng)求axios及他的副手(集中處理請(qǐng)求及返回?cái)?shù)據(jù)),畢竟axios和助手都是老員工,直接上手運(yùn)行,哎?怎么出來(lái)個(gè)什么鬼東西,看官請(qǐng)看:
?之前最多的就是在控制臺(tái)看到這種報(bào)錯(cuò),一下子干懵逼了。
廢話不多說(shuō)開搞
分析:
報(bào)錯(cuò)信息來(lái)自請(qǐng)求網(wǎng)絡(luò)時(shí)的反饋,打開控制臺(tái),追蹤錯(cuò)誤源,看到了是axios的副手,彈出來(lái)的錯(cuò)誤信息,而這個(gè)錯(cuò)誤并沒(méi)有按照預(yù)設(shè)的機(jī)制,也就是說(shuō)沒(méi)有走我們的錯(cuò)誤集中處理機(jī)制。
驗(yàn)證:
故意提交錯(cuò)誤的請(qǐng)求參數(shù)
?好家伙更長(zhǎng)了,哈哈,到這一步,我就大概確定了問(wèn)題的位置。接下來(lái)就是搞問(wèn)題,先是助手文件排查自身代碼問(wèn)題,ok,排查aixos版本問(wèn)題,ok,到這我已經(jīng)有點(diǎn)不知所措。喝口水,定睛一看,有個(gè)大膽的猜想,會(huì)不會(huì)是npm引用源的某些東西有更新什么的,再仔細(xì)查看報(bào)錯(cuò)信息,鎖定到webpack-dev-server身上
正常錯(cuò)誤機(jī)制下的package-lock.json
?全屏錯(cuò)誤機(jī)制下的package-lock.json
對(duì)比后發(fā)現(xiàn)版本升級(jí)了一點(diǎn)點(diǎn)。
確定猜想:
直接粗暴的替換了package-lock.json中當(dāng)前位置下的webpack-dev-server的有變化部分,完美正常顯示了,報(bào)錯(cuò)顯示在控制臺(tái),沒(méi)有全屏顯示了
ok確定了問(wèn)題,就可以處理了
解決問(wèn)題:
方案一:降級(jí)處理(按照普通降級(jí)無(wú)效,有了解的小伙伴希望能跟進(jìn)下,通知我學(xué)習(xí)下)
普通降級(jí)法
(1)、npm uninstall webpack-dev-server
(2)、npm install webpack-dev-server@4.11.1
(3)、npm run dev
無(wú)效哈,我試過(guò)了,可能只是不適合我的版本,有會(huì)的小伙伴,歡迎指正下,謝謝
個(gè)人意見(jiàn)是,webpack自己升級(jí)了,所以新構(gòu)建的話就會(huì)自動(dòng)生成最新版本的web-sev-server,屬于源文件吧,無(wú)法修改降級(jí)
方案二:devServer配置(此處使用的vue.config.js)
根據(jù)查詢的文檔配置:(無(wú)效,還是無(wú)效的話,繼續(xù)往下)
devServer: {
client: {
//當(dāng)出現(xiàn)編譯錯(cuò)誤或警告時(shí),在瀏覽器中是否顯示全屏覆蓋。 示例為只顯示錯(cuò)誤信息
overlay: {
errors: false,
warnings: false
},
},
},
看來(lái)我還是不適合這個(gè)配置,好,那我去追源文件
找到webpack-dev-server/client/ovelay.js,查看代碼尋找handleError,果然被我找到
?繼續(xù)追蹤,到webpack-dev-server/client/index.js,查看options.catchRuntimeError這個(gè)是怎么傳過(guò)來(lái)的
okk,試一下下
?
到這,結(jié)束了,嗯就結(jié)束了。
哈哈又沒(méi)結(jié)束,我又來(lái)了,我?guī)е?jiǎn)約的配置來(lái)了,是在評(píng)論區(qū)看到的,謝謝思密達(dá)
文章來(lái)源:http://www.zghlxwxcb.cn/news/detail-481732.html
希望能對(duì)各位看官有些啟發(fā),不足歡迎指正,嘻嘻,撒花完結(jié),么么噠?文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-481732.html
到了這里,關(guān)于axios請(qǐng)求錯(cuò)誤處理Uncaught runtime errors:handleError@webpack-internal:///./node_modules/webpack-dev-server的文章就介紹完了。如果您還想了解更多內(nèi)容,請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!