如何处理在 Angular CLI 中安装对等依赖项？

Posted 2023-02-16

【中文标题】如何处理在 Angular CLI 中安装对等依赖项？

【英文标题】：How do I deal with installing peer dependencies in Angular CLI?

【发布时间】：2018-07-15 12:17:13

【问题描述】：

在尝试更新 Angular CLI 和 NPM 时，我发现自己陷入了几乎无穷无尽的错误循环。每次更新时，都会收到 WARN 消息，告诉我安装对等依赖项（见下文），但每次安装依赖项时，都会收到更多 WARN 消息。有没有更好的方法来处理这种情况，还是真的需要几个小时？

npm WARN @angular/animations@5.2.1 requires a peer of @angular/core@5.2.1 
but none is installed. You must install peer dependencies yourself.
npm WARN @angular/compiler-cli@5.1.0 requires a peer of typescript@>=2.4.2 
<2.6 but none is installed. You must install peer dependencies yourself.
npm WARN @ng-bootstrap/ng-bootstrap@1.0.0-beta.6 requires a peer of 
@angular/core@^4.0.3 but none is installed. You must install peer 
dependencies yourself.
npm WARN @ng-bootstrap/ng-bootstrap@1.0.0-beta.6 requires a peer of 
@angular/common@^4.0.3 but none is installed. You must install peer 
dependencies yourself.
npm WARN @ng-bootstrap/ng-bootstrap@1.0.0-beta.6 requires a peer of 
@angular/forms@^4.0.3 but none is installed. You must install peer 
dependencies yourself.
npm WARN @schematics/angular@0.1.17 requires a peer of @angular-
devkit/core@0.0.29 but none is installed. You must install peer dependencies 
yourself.
npm WARN @schematics/angular@0.1.17 requires a peer of @angular-
devkit/schematics@0.0.52 but none is installed. You must install peer 
dependencies yourself.
npm WARN @schematics/schematics@0.0.11 requires a peer of @angular-
devkit/core@0.0.22 but none is installed. You must install peer dependencies 
yourself.
npm WARN angular2-notifications@0.7.4 requires a peer of 
@angular/core@^4.0.1 but none is installed. You must install peer 
dependencies yourself.
npm WARN angular2-notifications@0.7.4 requires a peer of 
@angular/common@^4.0.1 but none is installed. You must install peer 
dependencies yourself.
npm WARN angular2-notifications@0.7.4 requires a peer of @angular/platform-
browser@^4.0.0 but none is installed. You must install peer dependencies 
yourself.
npm WARN angular2-notifications@0.7.4 requires a peer of 
@angular/animations@^4.0.1 but none is installed. You must install peer 
dependencies yourself.
npm WARN bootstrap@4.0.0-beta.2 requires a peer of jquery@1.9.1 - 3 but none 
is installed. You must install peer dependencies yourself.
npm WARN bootstrap@4.0.0-beta.2 requires a peer of popper.js@^1.12.3 but 
none is installed. You must install peer dependencies yourself.
npm WARN ng2-toasty@4.0.3 requires a peer of @angular/core@^2.4.7 || ^4.0.0 
but none is installed. You must install peer dependencies yourself.
npm WARN ngx-carousel@1.3.5 requires a peer of @angular/core@^2.4.0 || 
^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN ngx-carousel@1.3.5 requires a peer of @angular/common@^2.4.0 || 
^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN tsickle@0.25.5 requires a peer of typescript@>=2.4.2 <2.6 but none 
is installed. You must install peer dependencies yourself.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.1.3 
(node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for 
fsevents@1.1.3: wanted "os":"darwin","arch":"any" (current: 
"os":"win32","arch":"x64")

我知道我一定做错了什么，但我是 Angular 的新手。

【参考方案1】：

对等依赖警告通常可以被忽略。唯一需要采取措施的情况是对等依赖项完全丢失，或者对等依赖项的版本高于您安装的版本。

我们以这个警告为例：

npm WARN @angular/animations@5.2.1 需要 @angular/core@5.2.1 但没有安装。您必须安装对等 自己依赖。

使用 Angular，您希望您使用的版本在所有包中保持一致。如果有任何不兼容的版本，请更改 package.json 中的版本，然后运行 ​​npm install 以使它们全部同步。我倾向于将我的 Angular 版本保持在最新版本，但您需要确保您的版本与您需要的任何 Angular 版本一致（可能不是最新版本）。

在这样的情况下：

npm WARN ngx-carousel@1.3.5 需要 @angular/core@^2.4.0 的 peer || ^4.0.0 但没有安装。您必须安装对等依赖项 自己。

如果您使用的 Angular 版本高于 4.0.0，那么您可能不会遇到任何问题。那就不用管这个了。如果您使用的是 2.4.0 以下的 Angular 版本，则需要升级您的版本。更新 package.json，然后运行 ​​npm install，或运行 npm install 以获得您需要的特定版本。像这样：

npm install @angular/core@5.2.3 --save

如果您运行的是 npm 5.0.0 或更高版本，您可以省略 --save，该版本会自动将包保存在 package.json 的依赖项部分中。

在这种情况下：

npm WARN 可选跳过可选依赖：fsevents@1.1.3 (node_modules\fsevents): npm WARN notsup 跳过可选依赖： fsevents@1.1.3 不受支持的平台：需要 "os":"darwin","arch":"any"（当前："os":"win32","arch":"x64"）

您正在运行 Windows，fsevent 需要 OSX。可以忽略此警告。

希望这对您有所帮助，并享受学习 Angular 的乐趣！

【讨论】：

谢谢！我应该更新 package.json 中“dependencies”和“devDependencies”中的版本，还是应该创建一个“peerDependencies”并将这些版本添加到其中？

我关于不必担心devDependencies 的评论是不正确的。您还需要更新该部分中的版本号。该部分中的 Angular 包应该与 dependencies 部分中的包具有相同的版本。更改版本可能还需要做一些事情。如有任何混淆，请见谅！

似乎是计算机的任务，所有信息都在 package.json 中，而且我的操作系统很明显，学习这些并不好玩。有一天，人们会说“我们的祖先为了让我们走到今天这一点付出了很多”

@R.Richards 写道：“如果您使用的 Angular 版本高于 4.0.0，那么您可能不会遇到任何问题。”分析仪能否检测到 Angular 是否存在高于 4.0.0？如果是，那么为什么要显示此警告？

抱歉我很迟钝，但我不明白为什么你会收到类似 `@angular/core@^2.4.0 || 的警告^4.0.0 但没有安装`如果您使用的是高于 4.0.0 的 Angular 版本……是因为版本关闭了吗？

【参考方案2】：

在更新依赖项时，您可以通过在 Angular cli 中使用 --force 标志来忽略对等依赖项警告。

ng update @angular/cli @angular/core --force

有关选项的完整列表，请查看文档：https://angular.io/cli/update

【讨论】：

我会发现这个答案会更有帮助，如果它包含一个快速解释它的作用以及为什么它可以帮助您解决 OP 提出的问题

@JTech 我已经更新了我的答案，感谢您的反馈。

在 clientapp 文件夹中使用 node js 命令提示符，它正在工作，非常感谢

【参考方案3】：

我发现在您的 Angular 项目所在的同一目录中运行 npm install 命令 可以消除这些警告。不知道是什么原因。

具体来说，我正在尝试使用 ng2-completer

$ npm install ng2-completer --save
npm WARN saveError ENOENT: no such file or directory, open 'C:\Work\foo\package.json'
npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN enoent ENOENT: no such file or directory, open 'C:\Work\foo\package.json'
npm WARN ng2-completer@3.0.3 requires a peer of @angular/common@>= 6.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN ng2-completer@3.0.3 requires a peer of @angular/core@>= 6.0.0 but noneis installed. You must install peer dependencies yourself.
npm WARN ng2-completer@3.0.3 requires a peer of @angular/forms@>= 6.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN foo No description
npm WARN foo No repository field.
npm WARN foo No README data
npm WARN foo No license field.

我无法编译。 当我再次尝试时，这次在 foo/foo_app 中的 Angular 项目目录中，它运行良好。

cd foo/foo_app
$ npm install ng2-completer --save

【参考方案4】：

NPM 包库在 package.json 文件中有一个名为 peerDependencies 的部分。例如; Angular 8 中构建的库，通常会将 Angular 8 列为依赖项。对于运行低于版本 8 的任何人来说，这是一个真正的依赖关系。但对于运行版本 8、9 或 10 的任何人，是否应该关注任何问题都是值得怀疑的。

我已经安全地忽略了 Angular 更新中的这些消息，但我们确实有单元测试和赛普拉斯测试！

【参考方案5】：

更新你的角度（全局）：

通过更新：

ng 更新@angular/cli @angular/core

或删除 angular 并重新安装：

npm uninstall -g @angular/clinpm install -g @angular/cli

之后，如果您想使用旧的 Angular 项目（本地）：

使用npm list 测试是否某些依赖项已更改并出现此错误：

npm 错误！缺少对等部门：mydependenci，某些组件需要

这意味着你必须更新你的项目：

然后您可以创建一个新项目，粘贴您的代码并重新安装所有依赖项 或者安装npm list需要的所有依赖：

npm install mydependencie