今天在创建vue项目时出现了两个问题,分享一下我是如何解决的。
npm 安装依赖时无法解析依赖树
报错如下:
可以看到这是由于本地安装的eslint版本过高所导致的
解决方案一
卸载or降低eslint的版本
npm uninstall eslint --dev
解决方案二
使用强制安装命令(不推荐)
npm i <PluginName> --f
解决方案三
使用同级安装命令,这是最佳解决方案,只要是安装依赖时无法解析依赖树时都可以用这个命令来解决
npm install --legacy-peer-deps
了解npm install xxxx --legacy-peer-deps
命令
好奇宝宝发现这个命令非常好用,于是专门去研究了一下npm install xxxx --legacy-peer-deps
命令是什么。为什么可以解决下载时候产生的依赖冲突呢?
npm install xxxx --legacy-peer-deps
命令是什么?
npm install xxxx --legacy-peer-deps
是一个npm命令,用于在安装依赖项时启用旧版的peer依赖项解析策略。在npm 7及更高版本中,默认启用了新版的peer依赖项解析策略,该策略更加严格,可能会引发一些依赖项冲突的问题。请注意,
--legacy-peer-deps
选项是为了解决旧版依赖项解析问题而提供的临时解决方案。在可能的情况下,建议你尽量更新和升级你的项目依赖项,以适应新版的peer依赖项解析策略。
此处我使用该命令解决的是依赖版本过高的情况
实际上,
--legacy-peer-deps
选项主要是为了解决旧版依赖项解析问题而提供的临时解决方案,而不是专门用于解决依赖版本过高的问题。使用--legacy-peer-deps
选项可以让npm在安装依赖项时放宽对peer依赖项版本的限制,但这并不意味着它可以解决所有与依赖版本过高相关的问题。当你使用
--legacy-peer-deps
选项时,npm可能会安装较旧的依赖项版本,以满足旧版的peer依赖项解析策略。这可能会导致一些依赖项版本过高的问题得到缓解,因为npm会更加宽松地解析依赖项版本的限制。但这并不是--legacy-peer-deps
选项的主要设计目的。
为什么可以解决下载时候产生的依赖冲突呢?
--legacy-peer-deps
选项可以解决下载时产生的依赖冲突,因为它会使npm使用旧版的peer依赖项解析策略。在新版peer依赖项解析策略中,如果一个模块依赖于另一个模块的特定版本,而它的直接依赖项中的peer依赖项指定了与该版本不兼容的版本范围,那么npm就会报错并拒绝安装。例如,如果模块A依赖于模块B的版本1.x,而模块C的peer依赖项指定了B的2.x版本,那么在新版peer依赖项解析策略下,npm会拒绝安装这些模块,并报告peer依赖项冲突错误。但是,在旧版peer依赖项解析策略下,npm会忽略peer依赖项的版本范围限制,并安装A和C,同时也安装B的1.x版本,以满足A的依赖关系。
Error: Cannot find module 'D:@vue\cli-service\bin\vue-cli-service.js
当我执行npm start serve(注意此处是什么要看package.json文件) 命令时报错如下
查阅资料后我发现两个解决方案
方案一
删除vue项目中的node_modules和package-lock.json文件,然后在cmd命令行直接npm install。
一.删除node_modules和package-lock.json文件
二.cmd命令行直接npm install
进入到项目所在文件夹输入命令npm install
方案二
下面详细介绍使用方案一不起效果的情况。
1.打开vue项目node_modules文件下.bin中的vue-cli-service.cmd
在该文件中原来定义如下:
2.将该文件的信息更改如下保存然后到cmd运行命令npm run serve
@IF EXIST "%~dp0\node.exe" (
"%~dp0\node.exe" "%~dp0\..\@vue\cli-service\bin\vue-cli-service.js" %*
) ELSE (
@SETLOCAL
@SET PATHEXT=%PATHEXT:;.JS;=;%
node "%~dp0\..\@vue\cli-service\bin\vue-cli-service.js" %*
)