首页 > 解决方案 > 无法在 VueCLI3 项目中安装 less-loader

问题描述

我项目的一些页面使用less来渲染,所以我运行npm命令安装less和less-loader,但发现less可以成功安装,由于未知原因,less-loader一直无法安装并抛出如下错误:

PS E:\myprogramming\tutorial\frontEND\eduResourceCode\Vue教程\复习\Vue脚手架CLI3\vuexdemo_> npm i less-loader
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!       4 more (@vue/cli-plugin-eslint, @vue/cli-plugin-router, ...)
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!       4 more (@vue/cli-plugin-eslint, @vue/cli-plugin-router, ...)
npm ERR!   18 more (@vue/cli-plugin-babel, @vue/cli-plugin-eslint, ...)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! less-loader@"*" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: webpack@5.38.1
npm ERR! node_modules/webpack
npm ERR!   peer webpack@"^5.0.0" from less-loader@9.1.0
npm ERR!   node_modules/less-loader
npm ERR!     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 C:\Users\hw\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\hw\AppData\Local\npm-cache\_logs\2021-06-13T12_28_33_753Z-debug.log

但是我的开发服务器没有less-loader就无法运行,我尝试了很多方法,比如重新安装两个依赖项,使用vue-cil下载同名插件,或者将其他less-loader标签粘贴到我的package.json但都不起作用.

我找到了一个可能但奇怪的原因是我的 node_modules 没有 less-loader 文件夹!现在我该如何解决? 在此处输入图像描述

标签: vue-cli-3less-loader

解决方案


我通过使用 css-prodecessor 合并我的项目,它解决了我的问题。但我仍然感到困惑。我不喜欢通过合并来解决问题,因为它会破坏我已经完成的一些文件。如果在我的项目建成后我可以拥有 less-loader 那就更好了。


推荐阅读