错误 TS2707 通用类型“??DirectiveDeclaration”需要 6 到 8 个类型参数

Question

安装角度材料并将 app.module.ts 中的角度材料导入添加到项目后，我遇到了错误，并且到目前为止所有解决方案都不起作用。我的角度为 14，节点为 16。第一个错误，实际上要长得多：

\n

Error: node_modules/@angular/cdk/a11y/index.d.ts:152:18 - error TS2707: Generic type '\xc9\xb5\xc9\xb5DirectiveDeclaration' requires between 6 and 8 type arguments.\n\n152     static \xc9\xb5dir: i0.\xc9\xb5\xc9\xb5DirectiveDeclaration<CdkAriaLive, "[cdkAriaLive]", ["cdkAriaLive"], { "politeness": "cdkAriaLive"; "duration": "cdkAriaLiveDuration"; }, {}, never, never, false, never>;\n                     ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~\n\n\nError: node_modules/@angular/cdk/a11y/index.d.ts:175:18 - error TS2707: Generic type '\xc9\xb5\xc9\xb5DirectiveDeclaration' requires between 6 and 8 type arguments.\n\n175     static \xc9\xb5dir: i0.\xc9\xb5\xc9\xb5DirectiveDeclaration<CdkMonitorFocus, "[cdkMonitorElementFocus], [cdkMonitorSubtreeFocus]", ["cdkMonitorFocus"], {}, { "cdkFocusChange": "cdkFocusChange"; }, never, never, false, never>;\n                     ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~\n\n\nError: node_modules/@angular/cdk/a11y/index.d.ts:208:18 - error TS2707: Generic type '\xc9\xb5\xc9\xb5DirectiveDeclaration' requires between 6 and 8 type arguments.\n\n208     static \xc9\xb5dir: i0.\xc9\xb5\xc9\xb5DirectiveDeclaration<CdkTrapFocus, "[cdkTrapFocus]", ["cdkTrapFocus"], { "enabled": "cdkTrapFocus"; "autoCapture": "cdkTrapFocusAutoCapture"; }, {}, never, never, false, never>;\n                     ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~\n\n\nError: node_modules/@angular/cdk/bidi/index.d.ts:37:18 - error TS2707: Generic type '\xc9\xb5\xc9\xb5DirectiveDeclaration' requires between 6 and 8 type arguments.\n\n37     static \xc9\xb5dir: i0.\xc9\xb5\xc9\xb5DirectiveDeclaration<Dir, "[dir]", ["dir"], { "dir": "dir"; }, { "change": "dirChange"; }, never, never, false, never>;\n                    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~\n\n\n\n\n

\n

{\n  "name": "highlight",\n  "version": "0.0.0",\n  "scripts": {\n    "ng": "ng",\n    "start": "ng serve",\n    "build": "ng build",\n    "watch": "ng build --watch --configuration development",\n    "test": "ng test"\n  },\n  "private": true,\n  "dependencies": {\n    "@angular/animations": "^14.2.4",\n    "@angular/cdk": "^15.0.0",\n    "@angular/common": "^14.2.4",\n    "@angular/compiler": "^14.2.4",\n    "@angular/core": "^14.2.4",\n    "@angular/forms": "^14.2.4",\n    "@angular/material": "^15.0.0",\n    "@angular/platform-browser": "^14.2.4",\n    "@angular/platform-browser-dynamic": "^14.2.4",\n    "@angular/router": "^14.2.4",\n    "@fortawesome/angular-fontawesome": "^0.11.1",\n    "@fortawesome/fontawesome-svg-core": "^6.2.0",\n    "@fortawesome/free-solid-svg-icons": "^6.2.0",\n    "@ng-bootstrap/ng-bootstrap": "^13.0.0",\n    "@popperjs/core": "^2.11.6",\n    "@syncfusion/ej2-angular-calendars": "^20.3.56",\n    "apexcharts": "^3.36.3",\n    "bootstrap": "^5.2.2",\n    "jwt-decode": "^3.1.2",\n    "ng-apexcharts": "^1.7.4",\n    "rxjs": "~6.6.0",\n    "tslib": "^2.3.0",\n    "zone.js": "~0.11.4"\n  },\n  "devDependencies": {\n    "@angular-devkit/build-angular": "^14.2.4",\n    "@angular/cli": "^14.2.4",\n    "@angular/compiler-cli": "^14.2.4",\n    "@angular/localize": "^14.2.4",\n    "@types/jasmine": "~3.8.0",\n    "@types/node": "^12.11.1",\n    "jasmine-core": "~3.8.0",\n    "karma": "~6.3.0",\n    "karma-chrome-launcher": "~3.1.0",\n    "karma-coverage": "~2.0.3",\n    "karma-jasmine": "~4.0.0",\n    "karma-jasmine-html-reporter": "~1.7.0",\n    "typescript": "4.7"\n  }\n}\n

\n

我尝试删除node_modules、.angular 和npm install。不起作用。\n接下来我尝试重新安装角度材料 - npm install --save @angular/material @angular/cdk - 给了我错误，但是不同的错误。我怀疑这显示了我实际错误的更清楚的原因。正如错误中所建议的，我尝试了命令 npm install --legacy-peer-deps, --force, npm install --save --legacy-peer-deps ，但不起作用。也许有人有更多经验并认识到这个问题？

\n

npm ERR! code ERESOLVE\nnpm ERR! ERESOLVE unable to resolve dependency tree\nnpm ERR! \nnpm ERR! While resolving: highlight@0.0.0\nnpm ERR! Found: @angular/common@14.2.12\nnpm ERR! node_modules/@angular/common\nnpm ERR!   @angular/common@"^14.2.4" from the root project\nnpm ERR! \nnpm ERR! Could not resolve dependency:\nnpm ERR! peer @angular/common@"^15.0.0 || ^16.0.0" from @angular/cdk@15.0.0\nnpm ERR! node_modules/@angular/cdk\nnpm ERR!   @angular/cdk@"^15.0.0" from the root project\nnpm ERR! \nnpm ERR! Fix the upstream dependency conflict, or retry\nnpm ERR! this command with --force, or --legacy-peer-deps\nnpm ERR! to accept an incorrect (and potentially broken) dependency resolution.\n

\n

我的结果：

\n

Angular CLI: 14.2.10\nNode: 16.10.0\nPackage Manager: npm 7.24.0 \nOS: darwin x64\n\nAngular: 14.2.12\n... animations, common, compiler, compiler-cli, core, forms\n... localize, platform-browser, platform-browser-dynamic, router\n\nPackage                         Version\n---------------------------------------------------------\n@angular-devkit/architect       0.1402.10\n@angular-devkit/build-angular   14.2.10\n@angular-devkit/core            14.2.10\n@angular-devkit/schematics      14.2.10\n@angular/cdk                    15.0.1\n@angular/cli                    14.2.10\n@angular/material               15.0.1\n@schematics/angular             14.2.10\nrxjs                            6.6.7\ntypescript                      4.7.4\n

\n

Answer 1

运行后我也遇到同样的错误ng update @angular/core@14 @angular/cl1@14。其他一些软件包已更新到v15.04我的pacakge.json. 我猜这些都是我应该链接到ng update命令的依赖项，以便将它们全部均匀更新到 v14。解决方案是将 v15 中的所有软件包的版本降级到 v14-lst。

我认为因为我的@angular/compilerand@angular/compiler-cli已更新为v15运行时触发编译错误的原因ng serve

更新：

配置完所有的 linter 后再次遇到这个问题。我认为除非确实需要，否则您不想检查或检查构建节点模块。拥有打字稿检查节点模块非常重要，特别是如果您不希望不同的包或同一包的不同副本具有冲突的类型声明。要解决此问题，请在 tsconfig.json 中的编译器选项下添加skipLibCheck: true

tsconfig.json

{
    ...
    complilerOptions: {
        ...
        "skipLibCheck": true
    }
}

这是skipLibCheck的官方文档

Answer 2

有同样的问题。如果您使用 Angular 14 ，请使用 ngrx/component 14.3.2 。或者直接更新到 Angular 15。