“HttpIntercept”类型中的属性“拦截”不能分配给基类型“HttpInterceptor”中的相同属性答案

【问题标题】：Property 'intercept' in type 'HttpIntercept' is not assignable to the same property in base type 'HttpInterceptor'“HttpIntercept”类型中的属性“拦截”不能分配给基类型“HttpInterceptor”中的相同属性
【发布时间】：2019-09-09 16:11:43
【问题描述】：

我正在尝试运行 Angular 应用程序。使用 ng serve，但错误即将到来如下：

node_modules/angular-authentication-service/dist/app/classes/http.intercept.d.ts(5,5) 中的错误：错误 TS2416：“HttpIntercept”类型中的属性“拦截”不可分配给相同的基类型“HttpInterceptor”中的属性。

Package.json 文件

"dependencies": {
    "@angular/animations": "^7.2.10",
    "@angular/cdk": "^7.3.5",
    "@angular/common": "7.0.1",
    "@angular/compiler": "7.0.1",
    "@angular/core": "7.0.1",
    "@angular/flex-layout": "^7.0.0-beta.24",
    "@angular/forms": "^6.1.10",
    "@angular/http": "^6.1.10",
    "@angular/material": "^6.4.7",
    "@angular/platform-browser": "7.0.1",
    "@angular/platform-browser-dynamic": "^7.2.10",
    "@angular/router": "7.0.1",
    "@firebase/app-types": "^0.3.7",
    "@firebase/auth-types": "^0.3.4",
    "@firebase/database-types": "^0.3.8",
    "@firebase/firestore-types": "^0.7.0",
    "@firebase/messaging-types": "^0.2.8",
    "@firebase/storage-types": "^0.2.8",
    "@ngrx/store": "^5.2.0",
    "angular-alert-module": "^2.0.3",
    "angular-authentication-service": "^1.1.8",
    "angular2-moment": "^1.9.0",
    "angularfire2": "^5.1.2",
    "bootstrap": "^4.3.1",
    "core-js": "^2.6.5",
    "firebase": "^5.9.1",
    "hammerjs": "^2.0.8",
    "jquery": "^3.3.1",
    "moment": "^2.24.0",
    "ng2-toasty": "^4.0.3",
    "ngx-alerts": "^3.4.1",
    "ngx-embed-video": "^0.3.0",
    "pusher-angular": "^1.0.0",
    "pusher-js": "^4.4.0",
    "rxjs": "^6.4.0",
    "rxjs-compat": "^6.4.0",
    "testacular": "^0.6.2",
    "videogular2": "^6.4.0",
    "webpack": "^4.29.6",
    "webpack-dev-server": "^2.11.5",
    "zone.js": "^0.8.29"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.6.8",
    "@angular/cli": "^7.0.7",
    "@angular/compiler-cli": "7.0.1",
    "@angular/language-service": "^6.1.10",
    "@types/core-js": "^2.5.0",
    "@types/jasmine": "^2.8.16",
    "@types/jasminewd2": "^2.0.6",
    "@types/node": "~8.9.4",
    "angular-froala-wysiwyg": "^2.9.3",
    "codelyzer": "~4.2.1",
    "jasmine-core": "~2.99.1",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~1.7.1",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "^2.0.5",
    "karma-jasmine": "~1.1.1",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "~5.3.0",
    "ts-node": "~5.0.1",
    "tslint": "~5.9.1",
    "typescript": "3.1.3"
  }

【问题讨论】：

标签： angular angular6 node-modules

【解决方案1】：

在与这个错误斗争了一整天后，我注意到我在我的库中使用了不同版本的 rxjs。它在库中比从另一个（自创建）库导入的版本高 0.0.1 版本，这导致了很多类似的错误，每个拦截器都给出了相同的错误，我们总共从那里导入了 2 个（自创建) 库。

确保你整体使用相同版本的 rxjs，这个问题就会消失。

【讨论】：

【解决方案2】：

我有一个类似的问题，我的情况是它与包版本有关。我检测到的方式是我检查了臭名昭著的 node_modules 文件夹。在某些模块上，我发现了一个嵌套的 node_modules 并在其中有不同的版本，例如 angular。所以修复是检查这些模块的 package.json，同步包版本删除 node_modules 文件夹，然后重试。

【讨论】：

这也解决了我的问题。可能需要一个绿色复选标记。
找到不同版本的最佳方法是什么？我有完全相同的问题。
嗯，我不确定哪个是最好的方法。一旦我发现了这个问题，我所做的就是寻找嵌套的 node_modules 文件夹，然后从那里获得 package.json 并从该 json 中获得不同的版本。里面可能不只是一个包，所以我只是一个一个地去，直到我解决所有问题。

【解决方案3】：

问题确实与 rxjs 版本不同。对我来说，这是在将一些代码从应用程序移动到新库时发生的

使用以下步骤解决此问题：

使用npm list rxjs 在应用中查找确切的 rxjs 版本
在 lib 上安装相同的版本

我遇到了 v6.6.0 的问题，而工作的版本是 v6.3.0

【讨论】：