您好,登錄后才能下訂單哦!
這篇文章主要介紹“vue安裝less-loader依賴失敗如何解決”的相關(guān)知識(shí),小編通過(guò)實(shí)際案例向大家展示操作過(guò)程,操作方法簡(jiǎn)單快捷,實(shí)用性強(qiáng),希望這篇“vue安裝less-loader依賴失敗如何解決”文章能幫助大家解決問(wèn)題。
vue可視化面板中提供的less-loader依賴安裝失敗,導(dǎo)致以下代碼識(shí)別不了,出現(xiàn)錯(cuò)誤信息
因?yàn)樵擁?xiàng)目開發(fā)用的腳手架是3.11.0版本的,不能用vue可視化面板中提供的less-loader10.1.0,所以要另外要下載低版本的less-loader,比如5.0.0的。
但是我在命令行窗口下載失敗,以管理員身份打開命令行窗口下載也失敗。
然后我在編譯器終端項(xiàng)目運(yùn)行以下代碼下載成功了,我用的編譯器是vscode
npm install less-loader@5.0.0
如果先前已在項(xiàng)目中安裝了高版本的less-loader依賴,而且用不了,建議卸載后,重新安裝低版本
卸載less-loader
npm uninstall less-loader
安裝less-loader 5.0.0版本
npm install less-loader@5.0.0
安裝 Less
// 一起安裝 $ npm i less less-loader -D // 分開安裝 $ npm i less -D $ npm i less-loader -D
但是在安裝 less-loader 的時(shí)候失敗,報(bào)錯(cuò):
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! Found: webpack@4.46.0
npm ERR! node_modules/webpack
npm ERR! peer webpack@"^4.0.0" from @intervolga/optimize-cssnano-plugin@1.0.6
npm ERR! node_modules/@intervolga/optimize-cssnano-plugin
npm ERR! @intervolga/optimize-cssnano-plugin@"^1.0.5" from @vue/cli-service@4.5.13
npm ERR! node_modules/@vue/cli-service
npm ERR! peer @vue/cli-service@"^3.0.0 || ^4.0.0-0" from @vue/cli-plugin-babel@4.5.13
npm ERR! node_modules/@vue/cli-plugin-babel
npm ERR! dev @vue/cli-plugin-babel@"~4.5.0" from the root project
npm ERR! 3 more (@vue/cli-plugin-router, @vue/cli-plugin-vuex, the root project)
npm ERR! peer webpack@"^4.0.0 || ^5.0.0" from @soda/friendly-errors-webpack-plugin@1.8.0
npm ERR! node_modules/@soda/friendly-errors-webpack-plugin
npm ERR! @soda/friendly-errors-webpack-plugin@"^1.7.1" from @vue/cli-service@4.5.13
npm ERR! node_modules/@vue/cli-service
npm ERR! peer @vue/cli-service@"^3.0.0 || ^4.0.0-0" from @vue/cli-plugin-babel@4.5.13
npm ERR! node_modules/@vue/cli-plugin-babel
npm ERR! dev @vue/cli-plugin-babel@"~4.5.0" from the root project
npm ERR! 3 more (@vue/cli-plugin-router, @vue/cli-plugin-vuex, the root project)
npm ERR! 16 more (@vue/cli-plugin-babel, @vue/cli-service, ...)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! dev less-loader@"*" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: webpack@5.42.1
npm ERR! node_modules/webpack
npm ERR! peer webpack@"^5.0.0" from less-loader@10.0.1
npm ERR! node_modules/less-loader
npm ERR! dev less-loader@"*" 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 /Users/dengzemiao/.npm/eresolve-report.txt for a full report.npm ERR! A complete log of this run can be found in:
npm ERR! /Users/dengzemiao/.npm/_logs/2021-07-06T01_37_12_820Z-debug.log
這其實(shí)是 npm 版本低了或者 less-loader 版本高了,只需升級(jí) npm 或者降低 less-loader 的安裝版本即可,其他 CSS解析器 也一樣。
怎么降低 less-loader 版本?
方式一:
1、通過(guò)新建項(xiàng)目,選擇 Vue 自帶的 Less,新建成功之后,找到 package.json 文件,查看對(duì)應(yīng)的 less、less-loader 版本,這樣就知道當(dāng)前支持情況了。
2、知道版本之后,安裝指定的版本
$ npm i less@3.0.4 -D$ npm i less-loader@5.0.0 -D
3、安裝成功之后需要重新運(yùn)行項(xiàng)目才會(huì)生效。
方式二:
1、直接安裝 Less 最新版本,然后通過(guò) npm 搜索 less-loader 查看版本列表,自行手動(dòng)安裝低版本,能安裝成功的就行
2、安裝 less
$ npm i less -D
3、通過(guò) NPM 官網(wǎng) 搜索 less-loader,獲得版本列表
4、然后一個(gè)一個(gè)版本的安裝下去,一直到安裝成功。
$ npm i less-loader@6.0.0 -D
5、安裝成功之后需要重新運(yùn)行項(xiàng)目才會(huì)生效。
關(guān)于“vue安裝less-loader依賴失敗如何解決”的內(nèi)容就介紹到這里了,感謝大家的閱讀。如果想了解更多行業(yè)相關(guān)的知識(shí),可以關(guān)注億速云行業(yè)資訊頻道,小編每天都會(huì)為大家更新不同的知識(shí)點(diǎn)。
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。