vue項(xiàng)目依賴升級報錯處理方式
vue項(xiàng)目依賴升級報錯處理
1.Vue Router 升級到3.5.1報錯：Navigation cancelled from "/login" to "/" with a new navigation
原因：Vue Router內(nèi)部報錯沒有進(jìn)行catch處理導(dǎo)致的編程式導(dǎo)航跳轉(zhuǎn)問題,往同一地址跳轉(zhuǎn)時會報錯，push和replace 都會導(dǎo)致這個情況的發(fā)生
import Vue from 'vue'
import VueRouter from 'vue-router';
?
Vue.use(Router)
//解決Vue Router在3.0版本以上push重復(fù)點(diǎn)擊報錯
const originalPush = VueRouter.prototype.push
VueRouter.prototype.push = function push(location, onResolve, onReject) {
? ? if (onResolve || onReject) return originalPush.call(this, location, onResolve, onReject)
? ? return originalPush.call(this, location).catch(err => err)
}
//解決Vue Router在3.0版本以上replace重復(fù)重定向報錯
const originalPushs = VueRouter.prototype.replace
VueRouter.prototype.replace = function replace(location, onResolve, onReject) {
? ? if (onResolve || onReject) return originalPushs.call(this, location, onResolve, onReject)
? ? return originalPushs.call(this, location).catch(err => err)
}
Vue.use(VueRouter);2.依賴升級后遇到的問題由autoprefixer版本引起的 warning：
Second Autoprefixer control comment was ignored. Autoprefixer applies control comment to whole block, not to next rules
解決方法：
// 將樣式中像下面的寫法 /* autoprefixer: off */ .... /* autoprefixer: on */ // 改為 ?? ? /* autoprefixer: ignore next */
3.編譯器報: start value has mixed support, consider using flex-start instead
start值具有混合支持，請考慮改用flex-start
解決方法：
全局ctrl+F搜索align-items: start;改為align-items: flex-start;
全局ctrl+F搜索justify-content: start;改為justify-content: flex-start;
4.編譯器報: end value has mixed support, consider using flex-end instead
解決方法：
全局ctrl+F搜索align-items: end;改為align-items: flex-end;
全局ctrl+F搜索justify-content: end;改為justify-content: flex-end;
當(dāng)啟動vue項(xiàng)目安裝依賴時報錯
當(dāng)啟動vue項(xiàng)目安裝依賴時報錯暫時想到四個原因：
1.node版本低，升級到新版本
2.執(zhí)行npm cache clean，再重新npm install
3.如果是下載依賴包失敗的話，可以使用cnpm淘寶鏡像下載，或者yarn下載安裝
4.報錯一般都會有錯誤提示，根據(jù)錯誤提示進(jìn)行操作
以上為個人經(jīng)驗(yàn)，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要介為大家詳細(xì)紹了vue微信分享插件的使用方法，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-02-02
Vue如何基于vue-i18n實(shí)現(xiàn)多國語言兼容
這篇文章主要介紹了Vue如何基于vue-i18n實(shí)現(xiàn)多國語言兼容,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友可以參考下2020-07-07
在vue項(xiàng)目中添加高德地圖,對開發(fā)地圖的開發(fā)人員有一定幫助,下面這篇文章主要給大家介紹了關(guān)于vue項(xiàng)目中使用高德地圖的超詳細(xì)步驟,文中通過圖文以及實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2023-03-03
這篇文章主要介紹了vue實(shí)現(xiàn)跨域的方法,結(jié)合實(shí)例形式分析了vue.js跨域的原理與相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下2019-05-05
這篇文章主要介紹了使用vue-touch報priority錯誤的解決方案，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-03-03
這篇文章主要介紹了vue中如何實(shí)時監(jiān)聽本地存儲，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-04-04
Vue項(xiàng)目打包并部署nginx服務(wù)器的詳細(xì)步驟
vue項(xiàng)目開發(fā)好之后需要部署到服務(wù)器上進(jìn)行外網(wǎng)訪問,下面這篇文章主要給大家介紹了關(guān)于Vue項(xiàng)目打包并部署nginx服務(wù)器的相關(guān)資料,文中通過實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-07-07
學(xué)習(xí) Vue 的時候覺得樣式綁定很簡單，但是使用的時候總是容易搞暈自己。這篇文章主要介紹了Vue 樣式綁定的實(shí)現(xiàn)方法，感興趣的小伙伴們可以參考一下2019-01-01
vue使用assign巧妙重置data數(shù)據(jù)方式
這篇文章主要介紹了vue使用assign巧妙重置data數(shù)據(jù)方式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-03-03
Vue 2源碼解析HTMLParserOptions.start函數(shù)方法
這篇文章主要為大家介紹了Vue 2源碼解析HTMLParserOptions.start函數(shù)方法，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-08-08