vue安裝vue-router出錯(cuò)問題及解決
項(xiàng)目場景
在vue中安裝vue-router
問題描述
提示：在安裝過程中報(bào)錯(cuò)，缺少依賴：
PS D:\WebDeplpyer\workspace\Vue_Basic\vue_test> npm i vue-router
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: vue_test@0.1.0
npm ERR! Found: vue@2.6.14
npm ERR! node_modules/vue
npm ERR! vue@"^2.6.11" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer vue@"^3.0.0" from vue-router@4.0.12
npm ERR! node_modules/vue-router
npm ERR! vue-router@"*" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\ASUS\AppData\Local\npm-cache\eresolve-report.txt for a full report.npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\ASUS\AppData\Local\npm-cache\_logs\2022-02-16T06_43_35_320Z-debug.log
原因分析
查閱資料，大部分都說是npm版本問題，新版本對(duì)下載要求比較嚴(yán)格。
解決方案
根據(jù)錯(cuò)誤提示，在命令行中加入–legacy-peer-deps，由于vue與vue-router版本兼容的問題，需要在安裝語句后加入需要下載vue-router版本，不然會(huì)下載最新的vue-router版本。
npm install --legacy-peer-deps vue-router@4.0.13
也有可能因?yàn)槭悄阋螺d的router版本過高，如果下載版本過高，在啟動(dòng)項(xiàng)目時(shí)會(huì)報(bào)錯(cuò)，可以下載低版本的vue-router
npm install vue-router@3.1.3 --save-dev
在package.json文件中查看是否下載成功
"dependencies": {
"animate.css": "^4.1.1",
"axios": "^0.25.0",
"chromedriver": "^98.0.0",
"core-js": "^3.6.5",
"nanoid": "^3.2.0",
"pubsub-js": "^1.9.4",
"vue": "^2.6.11",
"vue-resource": "^1.5.3",
"vue-router": "^3.1.3",
"vuex": "^3.6.2"
},總結(jié)
以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
基于Vue3和Fabric.js實(shí)現(xiàn)交互式多邊形繪制功能
最近學(xué)習(xí)Fabric.js,正好想著利用這個(gè)機(jī)會(huì)去實(shí)現(xiàn)一個(gè)多邊形的繪制工具,該工具允許用戶在圖片上通過點(diǎn)擊創(chuàng)建多邊形區(qū)域,支持自定義邊數(shù),并提供友好的用戶交互體驗(yàn),這種工具通常用于圖像標(biāo)注、區(qū)域選擇和交互式地圖應(yīng)用等場景,需要的朋友可以參考下2025-05-05
Vue 實(shí)現(xiàn)定時(shí)刷新與自動(dòng)更新(示例詳解)
在現(xiàn)代 Web 開發(fā)中,定時(shí)刷新頁面或定時(shí)更新數(shù)據(jù)是一種常見的需求,尤其是在需要與服務(wù)器進(jìn)行定時(shí)通信或者展示實(shí)時(shí)數(shù)據(jù)的場景下,Vue.js 提供了簡單而有效的方法來實(shí)現(xiàn)定時(shí)刷新和自動(dòng)更新,本文將介紹幾種常見的定時(shí)刷新方式、適用場景、優(yōu)缺點(diǎn)以及性能考慮2024-11-11
這篇文章主要介紹了vue3 vite配置跨域以及不生效問題,本文給大家分享完美解決方案，需要的朋友可以參考下2023-07-07
vue打包后,用后端接口報(bào)錯(cuò)304、404問題
這篇文章主要介紹了vue打包后,用后端接口報(bào)錯(cuò)304、404問題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-05-05
基于vue 實(shí)現(xiàn)token驗(yàn)證的實(shí)例代碼
這篇文章主要介紹了基于vue 實(shí)現(xiàn)token驗(yàn)證的實(shí)例代碼,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下2017-12-12
這篇文章主要給大家介紹了關(guān)于如何用Vue3切換中英文顯示的相關(guān)資料,在Vue3中使用vue-i18n進(jìn)行國際化設(shè)置,包括安裝、配置、在組件中使用$t方法獲取翻譯字符串,以及可選的動(dòng)態(tài)加載語言包以提高性能,需要的朋友可以參考下2024-11-11
vite+vue3項(xiàng)目初始化搭建的實(shí)現(xiàn)步驟
本文主要介紹了vite+vue3項(xiàng)目初始化搭建的實(shí)現(xiàn)步驟,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2024-07-07
vue3+vite實(shí)現(xiàn)低版本瀏覽器兼容的解決方案(出現(xiàn)白屏問題)
項(xiàng)目全線使用vue3的時(shí)候,自然使用的是配套更加契合的vite打包工具,于是自然而然會(huì)用到很多新的語法,本文給大家介紹了vue3+vite實(shí)現(xiàn)低版本瀏覽器兼容的解決方案(出現(xiàn)白屏問題),需要的朋友可以參考下2024-04-04
vue項(xiàng)目tween方法實(shí)現(xiàn)返回頂部的示例代碼
這篇文章主要介紹了vue項(xiàng)目tween方法實(shí)現(xiàn)返回頂部,小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-03-03
文章介紹如何在前端開發(fā)中配置多個(gè)代理進(jìn)行本地mock,以便同時(shí)處理開發(fā)完成和未開發(fā)完成的接口,主要步驟包括修改`.env.development`文件,創(chuàng)建并配置`request-mock.js`文件,以及在`vite.config.js/ts`中添加代理配置2025-12-12