如何手动更新 Angular 以使用 eslint 并删除 tslint

Question

我之前曾尝试从 tslint 转换为 eslint，但我从未通过ng add @angular-eslint/schematics

因为我使用的是旧的 Angular 版本（8），我想我会等到更新，而我现在刚刚更新到最新的（14）

现在我已经更新了，我仍然无法运行上面的。 我明白了。。

        $ ng add @angular-eslint/schematics
    Skipping installation: Package already installed
            
            All @angular-eslint dependencies have been successfully installed 🎉

            Please see https://github.com/angular-eslint/angular-eslint for how to add ESLint configuration to your project.

    UPDATE package.json (7380 bytes)
    ⠏ Installing packages (npm)...npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead.
    npm WARN ERESOLVE overriding peer dependency
    npm WARN While resolving: myApp@undefined
    npm WARN Found: eslint@7.32.0
    npm WARN node_modules/eslint
    npm WARN   dev eslint@"^8.17.0" from the root project
    npm WARN   15 more (@angular-eslint/builder, ...)
    npm WARN
    npm WARN Could not resolve dependency:
    npm WARN peer eslint@"^2 || ^3 || ^4 || ^5 || ^6 || ^7.2.0" from eslint-plugin-import@2.22.1
    npm WARN node_modules/eslint-plugin-import
    npm WARN   dev eslint-plugin-import@"2.22.1" from the root project
    npm WARN ERESOLVE overriding peer dependency
    npm WARN While resolving: myApp@undefined
    npm WARN Found: eslint@7.32.0
    npm WARN node_modules/eslint
    npm WARN   dev eslint@"^8.17.0" from the root project
    npm WARN   15 more (@angular-eslint/builder, ...)
    npm WARN
    npm WARN Could not resolve dependency:
    npm WARN peer eslint@"^6.0.0 || ^7.0.0" from eslint-plugin-jsdoc@30.7.6
    npm WARN node_modules/eslint-plugin-jsdoc
    npm WARN   dev eslint-plugin-jsdoc@"30.7.6" from the root project
    npm ERR! code ERESOLVE
    npm ERR! ERESOLVE could not resolve
    npm ERR!
    npm ERR! While resolving: @ngrx/effects@13.2.0
    npm ERR! Found: @angular/core@14.0.2
    npm ERR! node_modules/@angular/core
    npm ERR!   @angular/core@"^14.0.2" from the root project
    npm ERR!   peer @angular/core@"14.0.2" from @angular/animations@14.0.2
    npm ERR!   node_modules/@angular/animations
    npm ERR!     @angular/animations@"^14.0.2" from the root project
    npm ERR!     peerOptional @angular/animations@"14.0.2" from @angular/platform-browser@14.0.2
    npm ERR!     node_modules/@angular/platform-browser
    npm ERR!       @angular/platform-browser@"^14.0.2" from the root project
    npm ERR!       3 more (@angular/forms, @angular/platform-browser-dynamic, @angular/router)
    npm ERR!   12 more (@angular/common, @angular/compiler, @angular/forms, ...)
    npm ERR!
    npm ERR! Could not resolve dependency:
    npm ERR! peer @angular/core@"^13.0.0" from @ngrx/effects@13.2.0
    npm ERR! node_modules/@ngrx/effects
    npm ERR!   @ngrx/effects@"^13.2.0" from the root project
    npm ERR!
    npm ERR! Conflicting peer dependency: @angular/core@13.3.11
    npm ERR! node_modules/@angular/core
    npm ERR!   peer @angular/core@"^13.0.0" from @ngrx/effects@13.2.0
    npm ERR!   node_modules/@ngrx/effects
    npm ERR!     @ngrx/effects@"^13.2.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\peter\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\peter\AppData\Local\npm-cache\_logs\2022-06-20T09_30_09_455Z-debug-0.log
    ✖ Package install failed, see above.
    The Schematic workflow failed. See above.

在源代码中，如果我创建一个错误，我仍然看到它是tslint拾取它

我的 Angular 开发依赖项是

"devDependencies": {
"@angular-devkit/architect": "^0.1400.2",
"@angular-devkit/build-angular": "^14.0.2",
"@angular-devkit/core": "^14.0.2",
"@angular-devkit/schematics": "^14.0.2",
"@angular-eslint/builder": "14.0.0-alpha.3",
"@angular-eslint/eslint-plugin": "14.0.0-alpha.3",
"@angular-eslint/eslint-plugin-template": "14.0.0-alpha.3",
"@angular-eslint/schematics": "14.0.0-alpha.3",
"@angular-eslint/template-parser": "14.0.0-alpha.3",
"@angular/cli": "^14.0.2",
"@angular/compiler": "^14.0.2",
"@angular/compiler-cli": "^14.0.2",
"@angular/language-service": "^14.0.2",
"@ionic/angular-toolkit": "^2.0.0",

所以，我弄坏了一些东西，想知道如何解决这个问题并更新

Answer 1

运行ng add命令后，安装依赖项时出现的错误来自@ngrx/effects 。 这个包需要 angular 13，但是你安装了 angular 14。 @ngrx/effects 似乎还不支持 angular 14，请检查此版本14.0.0-rc.0 。

还要检查你的 vscode 插件，确保禁用tslint并安装/启用eslint 。 我还假设您转换了 lint 配置。

如果您同时安装了两个插件，它会不时抛出奇怪的错误