如何安装正确版本的@angular-eslint/schematic以匹配我的角度编译器?

问题描述 投票:0回答:5

我正在使用 npm v 8.11.0。我在我的 package.json 文件中定义了这些依赖项

"@angular/compiler": "^13.2.6",
"@angular/core": "^13.2.6",

我想让“ng lint”运行,但显然我需要运行迁移,所以我运行了

$ ng add @angular-eslint/schematics
Your global Angular CLI version (14.0.5) is greater than your local version (13.2.6). The local Angular CLI version is used.

To disable this warning use "ng config -g cli.warnings.versionMismatch false".
ℹ Using package manager: npm
✔ Found compatible package version: @angular-eslint/[email protected].
✔ Package information loaded.

The package @angular-eslint/[email protected] will be installed and executed.
Would you like to proceed? Yes
npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead.
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: @angular/[email protected]
npm ERR! Found: @angular/[email protected]
npm ERR! node_modules/@angular/compiler
npm ERR!   peer @angular/compiler@"13.3.0" from @angular/[email protected]
npm ERR!   node_modules/@angular/platform-browser-dynamic
npm ERR!     @angular/platform-browser-dynamic@"^13.2.6" from the root project
npm ERR!   @angular/compiler@"^13.2.6" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer @angular/compiler@"13.2.7" from @angular/[email protected]
npm ERR! node_modules/@angular/compiler-cli
npm ERR!   peer @angular/compiler-cli@"^13.0.0" from @angular-devkit/[email protected]
npm ERR!   node_modules/@angular-devkit/build-angular
npm ERR!     dev @angular-devkit/build-angular@"~13.2.5" from the root project
npm ERR!   peer @angular/compiler-cli@"^13.0.0" from @ngtools/[email protected]
npm ERR!   node_modules/@ngtools/webpack
npm ERR!     @ngtools/webpack@"13.2.6" from @angular-devkit/[email protected]
npm ERR!     node_modules/@angular-devkit/build-angular
npm ERR!       dev @angular-devkit/build-angular@"~13.2.5" from the root project
npm ERR!   1 more (the root project)
npm ERR!
npm ERR! Conflicting peer dependency: @angular/[email protected]
npm ERR! node_modules/@angular/compiler
npm ERR!   peer @angular/compiler@"13.2.7" from @angular/[email protected]
npm ERR!   node_modules/@angular/compiler-cli
npm ERR!     peer @angular/compiler-cli@"^13.0.0" from @angular-devkit/[email protected]
npm ERR!     node_modules/@angular-devkit/build-angular
npm ERR!       dev @angular-devkit/build-angular@"~13.2.5" from the root project
npm ERR!     peer @angular/compiler-cli@"^13.0.0" from @ngtools/[email protected]
npm ERR!     node_modules/@ngtools/webpack
npm ERR!       @ngtools/webpack@"13.2.6" from @angular-devkit/[email protected]
npm ERR!       node_modules/@angular-devkit/build-angular
npm ERR!         dev @angular-devkit/build-angular@"~13.2.5" from the root project
npm ERR!     1 more (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\mydemouser\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\mydemouser\AppData\Local\npm-cache\_logs\2022-07-15T13_41_12_993Z-debug-0.log
✖ Package install failed, see above.

如何正确安装正确版本的工具以匹配我正在使用的编译器?

编辑:响应给出的答案,这是清除package-lock和node_modules时再次运行命令后的输出

> ng add @angular-eslint/schematics
i Using package manager: npm
√ Found compatible package version: @angular-eslint/[email protected].
√ Package information loaded.

The package @angular-eslint/[email protected] will be installed and executed.
Would you like to proceed? Yes
npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead.
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: [email protected]
npm ERR! Found: @angular/[email protected]
npm ERR! node_modules/@angular/common
npm ERR!   @angular/common@"^13.2.6" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer @angular/common@"^9.0.0" from [email protected]
npm ERR! node_modules/ng-http-loader
npm ERR!   ng-http-loader@"^7.0.0" 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\myuser\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\myuser\AppData\Local\npm-cache\_logs\2022-07-20T16_52_29_241Z-debug-0.log
× Packages installation failed, see above.

编辑2:响应@Alex的回答,升级依赖项后我收到此错误

> ng add @angular-eslint/schematics
Your global Angular CLI version (14.0.5) is greater than your local version (13.2.6). The local Angular CLI version is used.

To disable this warning use "ng config -g cli.warnings.versionMismatch false".
i Using package manager: npm
√ Found compatible package version: @angular-eslint/[email protected].
√ Package information loaded.

The package @angular-eslint/[email protected] will be installed and executed.
Would you like to proceed? Yes
npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead.
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: @angular/[email protected]
npm ERR! Found: @angular/[email protected]
npm ERR! node_modules/@angular/compiler
npm ERR!   peer @angular/compiler@"13.3.0" from @angular/[email protected]
npm ERR!   node_modules/@angular/platform-browser-dynamic
npm ERR!     @angular/platform-browser-dynamic@"^13.2.6" from the root project
npm ERR!   @angular/compiler@"^13.2.6" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer @angular/compiler@"13.2.7" from @angular/[email protected]
npm ERR! node_modules/@angular/compiler-cli
npm ERR!   peer @angular/compiler-cli@"^13.0.0" from @angular-devkit/[email protected]
npm ERR!   node_modules/@angular-devkit/build-angular
npm ERR!     dev @angular-devkit/build-angular@"~13.2.5" from the root project
npm ERR!   peer @angular/compiler-cli@"^13.0.0" from @ngtools/[email protected]
npm ERR!   node_modules/@ngtools/webpack
npm ERR!     @ngtools/webpack@"13.2.6" from @angular-devkit/[email protected]
npm ERR!     node_modules/@angular-devkit/build-angular
npm ERR!       dev @angular-devkit/build-angular@"~13.2.5" from the root project
npm ERR!   1 more (the root project)
npm ERR!
npm ERR! Conflicting peer dependency: @angular/[email protected]
npm ERR! node_modules/@angular/compiler
npm ERR!   peer @angular/compiler@"13.2.7" from @angular/[email protected]
npm ERR!   node_modules/@angular/compiler-cli
npm ERR!     peer @angular/compiler-cli@"^13.0.0" from @angular-devkit/[email protected]
npm ERR!     node_modules/@angular-devkit/build-angular
npm ERR!       dev @angular-devkit/build-angular@"~13.2.5" from the root project
npm ERR!     peer @angular/compiler-cli@"^13.0.0" from @ngtools/[email protected]
npm ERR!     node_modules/@ngtools/webpack
npm ERR!       @ngtools/webpack@"13.2.6" from @angular-devkit/[email protected]
npm ERR!       node_modules/@angular-devkit/build-angular
npm ERR!         dev @angular-devkit/build-angular@"~13.2.5" from the root project
npm ERR!     1 more (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! A complete log of this run can be found in:

编辑3:这是我运行@Mohammed.Kotkotly的答案时得到的错误...

> ng add @angular-eslint/[email protected]
√ Package information loaded.

The package @angular-eslint/[email protected] will be installed and executed.
Would you like to proceed? Yes
npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead.
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: @angular/[email protected]
npm ERR! Found: @angular/[email protected]
npm ERR! node_modules/@angular/compiler
npm ERR!   peer @angular/compiler@"13.3.0" from @angular/[email protected]
npm ERR!   node_modules/@angular/platform-browser-dynamic
npm ERR!     @angular/platform-browser-dynamic@"^13.2.6" from the root project
npm ERR!   @angular/compiler@"^13.2.6" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer @angular/compiler@"13.2.7" from @angular/[email protected]
npm ERR! node_modules/@angular/compiler-cli
npm ERR!   peer @angular/compiler-cli@"^13.0.0" from @angular-devkit/[email protected]
npm ERR!   node_modules/@angular-devkit/build-angular
npm ERR!     dev @angular-devkit/build-angular@"~13.2.5" from the root project
npm ERR!   peer @angular/compiler-cli@"^13.0.0" from @ngtools/[email protected]
npm ERR!   node_modules/@ngtools/webpack
npm ERR!     @ngtools/webpack@"13.2.6" from @angular-devkit/[email protected]
npm ERR!     node_modules/@angular-devkit/build-angular
npm ERR!       dev @angular-devkit/build-angular@"~13.2.5" from the root project
npm ERR!   1 more (the root project)
npm ERR!
npm ERR! Conflicting peer dependency: @angular/[email protected]
npm ERR! node_modules/@angular/compiler
npm ERR!   peer @angular/compiler@"13.2.7" from @angular/[email protected]
npm ERR!   node_modules/@angular/compiler-cli
npm ERR!     peer @angular/compiler-cli@"^13.0.0" from @angular-devkit/[email protected]
npm ERR!     node_modules/@angular-devkit/build-angular
npm ERR!       dev @angular-devkit/build-angular@"~13.2.5" from the root project
npm ERR!     peer @angular/compiler-cli@"^13.0.0" from @ngtools/[email protected]
npm ERR!     node_modules/@ngtools/webpack
npm ERR!       @ngtools/webpack@"13.2.6" from @angular-devkit/[email protected]
npm ERR!       node_modules/@angular-devkit/build-angular
npm ERR!         dev @angular-devkit/build-angular@"~13.2.5" from the root project
npm ERR!     1 more (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\dt236609\AppData\Local\npm-cache\eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:

       
angular lint angular13 angular-compiler
5个回答
4
投票

问题是由于兼容性造成的,根据 Angular ESLint Publisher

尝试

ng add @angular-eslint/[email protected]

2
投票

您的新堆栈跟踪解释了您的错误。您已安装

[email protected]
,它仅与 Angular
^9.0.0
兼容。将 ng-http 加载器更新为 >=11.0.0.


2
投票

只需在安装时为每个包指定相同的版本即可:

ng update @angular/core@12 @angular/cli@12

ng update @angular-eslint/schematics@12

1
投票

尝试以下步骤。应该可以解决问题。

  1. 创建一个全新的 Angular 项目。使用当前项目中的特殊设置,例如您使用 scss 进行样式。
  2. 使用
    ng add @angular-eslint/schematics
    命令添加 lint 原理图。它应该完全合适。
  3. 如果您使用的是 Angular Material,还可以使用
    ng add @angular/material
    命令进行配置。
  4. 在此处安装您当前项目使用的依赖项。

就像查看您的 package.json,然后比较您的项目具有而这些新项目没有的依赖项,然后安装它们。类似的东西

npm install dep1 dep2 dep3 ...

其中 dep 表示依赖。这样做,以便 npm 可以重新配置依赖版本。

  1. 将项目中的
    .git
    src
    文件夹复制到这个新项目中。这样做,以便您可以从结束的地方继续编码。

在所有条件相同的情况下,您应该只对项目的配置文件进行细微的更改(angular.json,package.json,package-lock.json,...)并且一切都应该正常工作。您现在应该开始从这个新的(变旧的)项目开始工作

当我尝试使用

ng add @nguniversal/express-engine
添加服务器端渲染时,我曾经使用过上述解决方法。我一直像你一样遇到依赖冲突错误,直到我执行上述操作。

旧答案

这个问题确实不是来自 Angular(也不是原理图 linter),而是来自 NPM。

要解决此问题,请删除

package-lock.json
node_modules
。再次运行
npm install
。然后运行原理图命令。

删除

package-lock.json
通常可以解决此问题,因为现有的
package-lock.json
可能会阻止 NPM 正确排序依赖项和版本。因此,间接依赖项深处存在版本更新,可能会发生冲突并导致此错误。


0
投票

对我来说,修复方法是将

@angular-eslint/schematics
更新与
@angular/core@12 @angular/cli@12
更新一起运行。 升级到 Angular 17

ng update @angular/core@17 @angular/cli@17 @angular-eslint/schematics
© www.soinside.com 2019 - 2024. All rights reserved.