我如何解决这个问题＆＃34;主题错误地扩展了Observable＆＃34; TypeScript 2.4和RxJS 5.x中的错误？

Question

编译时，我在RxJS声明文件中遇到以下编译器错误：

node_modules/rxjs/Subject.d.ts(16,22): error TS2415: Class 'Subject<T>' incorrectly extends base class 'Observable<T>'.
  Types of property 'lift' are incompatible.
    Type '<R>(operator: Operator<T, R>) => Observable<T>' is not assignable to type '<R>(operator: Operator<T, R>) => Observable<R>'.
      Type 'Observable<T>' is not assignable to type 'Observable<R>'.
         Type 'T' is not assignable to type 'R'.

这里发生了什么，如何在不降级到TypeScript 2.3或更早版本的情况下解决这个问题？

Answer 1

解决方案

RxJS 5.4.2现在应该与TypeScript 2.4.1完美配合。 如果可能，只需升级到5.4.2+。

npm install --save rxjs@^5.4.2

如果没有，以下解决方案应该有效。

替代解决方案

较新版本的RxJS将修复此问题，但作为临时解决方法，您可以使用noStrictGenericChecks编译器选项。

在tsconfig.json中，将其放入"compilerOptions"并将其设置为true。

{
    "compilerOptions": {
        "noStrictGenericChecks": true
    }
}

在命令行上--noStrictGenericChecks。

为什么会发生

TypeScript 2.4有严格的更改，Subject<T>没有提升到正确的Observable。签名确实应该是

<R>(operator: Operator<T, R>) => Observable<R>

这将在RxJS 6中修复。

Answer 2

今天，面对这个错误并通过以下三个步骤解决了这个问题。所以与希望分享同样的东西，这将有助于其他人。

步骤1：在package.json文件中将条目更改为＆＃34; rxjs＆＃34;：＆＃34; 5.4.2＆＃34;，

第2步：从项目中删除node_modules文件夹，该文件夹存在于根目录中

第3步：现在，右键单击package.json文件，然后单击“还原”，如下所示：  

注意：它将再次使用新文件创建node_module文件夹，现在构建解决方案，希望您不会得到与上述问题相关的任何构建错误。

Answer 3

添加

"noStrictGenericChecks": true

tsconfig.json文件中的

Answer 4

我在package.json文件中进行了以下两项更改。

1）在依赖项部分中将rxjs版本更改为5.4.1。

＆＃34;依赖性＆＃34 ;:    {
        ＆＃34; rxjs＆＃34;：＆＃34; 5.4.1＆＃34;    }

2）在devDependencies部分将typescript版本更改为2.4.0。

＆＃34; devDependencies＆＃34;：{         ＆＃34;打字稿＆＃34;：＆＃34; 2.4.0＆＃34;     }

我跑了 npm install ＆＃39;在进行了两次更改后命令工作。

Answer 5

在您的主题课程中：

更改此行：

lift<R>(operator: Operator<T, R>): Observable<T>;

到：

lift<R>(operator: Operator<T, R>): Observable<R>;

Answer 6

我在package.json文件中进行了以下更改。

 "dependencies": {
    "@angular/animations": "4.1.3",
    "@angular/common": "4.4.6",
    "@angular/compiler": "4.4.6",
    "@angular/compiler-cli": "2.4.8",
    "@angular/core": "4.4.6",
    "@angular/forms": "4.4.6",
    "@angular/http": "4.4.6",
    "@angular/platform-browser": "4.4.6",
    "@angular/platform-browser-dynamic": "4.4.6",
    "@angular/platform-server": "4.4.6",
    "@angular/router": "4.4.6",
    "@ionic/storage": "2.0.0",
    "cordova-plugin-console": "1.0.5",
    "cordova-plugin-device": "1.1.4",
    "cordova-plugin-splashscreen": "~4.0.1",
    "cordova-plugin-statusbar": "2.2.1",
    "cordova-plugin-whitelist": "1.3.1",
    "ionic-angular": "2.2.0",
    "ionic-native": "2.4.1",
    "ionic-plugin-keyboard": "~2.2.1",
    "ionic-tooltips": "^2.0.0",
    "ionicons": "3.0.0",
    "rxjs": "^5.4.2",
    "sw-toolbox": "3.4.0",
    "typescript": "2.4.0",
    "zone.js": "0.7.2"
  }

rxjs和打字稿版本的变化。

Answer 7

这是rxjs和typscript之间的不匹配问题，使用＆＃34; rxjs＆＃34;：＆＃34; 5.4.2＆＃34;和＆＃34;打字稿＆＃34;：＆＃34; ~2.3.4＆＃34;适合我

Answer 8

我遇到了同样的问题，发现以下网站很有帮助https://www.georgephillipson.com/blog/jquery/setting-up-angular-2-in-visual-studio-2017/，其中包含有关为MVC网站设置Angular的分步说明，解释了如何解决本文所指的错误，以及一个链接完整代码访问GitHub。

我发现它很有帮助，以为我会让别人知道

根据Zoes帖子，我添加了更多有关为什么我认为该链接可能有用的信息

该页面显示了如何更新RxJS以修复错误，还显示了如何检查计算机上是否安装了Node和NPM，并说明了如何添加TypeScript，然后显示了如何设置要显示的cshtml文件角度内容

Answer 9

在tsconfig.json中，将其放在“ compilerOptions”中，并将其设置为true。

{
    "compilerOptions": true,
    "compilerOptions": {
        "noStrictGenericChecks": true
    }
}