如何在 TypeScript 2.4 和 RxJS 5.x 中解决“Subject incorrectly extends Observable”错误?

46

当我编译时,在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 或更早的版本?
9个回答

130

解决方案

RxJS 5.4.2 现在已与 TypeScript 2.4.1 完美兼容。如果可能,请升级到 5.4.2+ 版本。

npm install --save rxjs@^5.4.2

如果您没有立即看到更改,请尝试重启编辑器和/或重新编译。

如果还有问题,下面的解决方案应该有效。

为什么会发生这种情况

TypeScript 2.4进行了一项严格性变更,Subject<T>未升级到正确的Observable。 签名实际上应该是

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

这个问题将会在 RxJS 6 中得到修复。

替代解决方案

较新版本的 RxJS 将会修复这个问题,但是作为一个临时的解决方法,你可以使用 noStrictGenericChecks 编译选项。

tsconfig.json 文件中,在 "compilerOptions" 中添加并将其设置为 true

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

在命令行中,它是 --noStrictGenericChecks

我在哪里可以使用"--noStrictGenericChecks"? - RemyaJ
2
在你的 tsconfig.json 文件中,compilerOptions 的设置。只需移除破折号并将其设为 true - Daniel Rosenwasser
你能帮我看一下这个问题吗 - https://stackoverflow.com/questions/44817801/webpack-apache-build-not-updating 。我认为是因为我的 TypeScript 更新到了 2.4.1 才出现了这个问题。 - RemyaJ
除了我的TypeScript 2.4.0运行时不知道noStrictGenericChecks选项之外,尝试设置它会导致错误。 - Yavin5
--noStrictGenericChecks 对我很有帮助。非常感谢。 - Ashu
显示剩余2条评论

14

今天,我遇到了这个错误,并通过以下三个步骤实际解决了它。现在分享给大家,希望能对其他人有所帮助。

第一步:在package.json文件中更改条目为"rxjs": "5.4.2",

第二步:从项目的根目录中删除node_modules文件夹。

第三步:现在,右键单击package.json文件,然后单击“还原”,如下所示: 图片描述

注意:它将再次创建带有新文件的node_module文件夹。现在构建解决方案,希望您不会遇到任何与上述问题相关的构建错误。


1
对我来说解决了问题。你会认为官方Angular网站上的教程会与最新版本保持同步,但事实并非如此。 - brz
是的,你说得对,很高兴它解决了你的问题@breez。愉快地分享.. :) - Karthik Elumalai

12

添加

"noStrictGenericChecks": true

在 tsconfig.json 文件中


7
我已经在package.json文件中做了以下两个更改。
1) 在依赖项部分将rxjs版本更改为5.4.1。
"dependencies": { "rxjs": "5.4.1" }
2) 在devDependencies部分将typescript版本更改为2.4.0。
"devDependencies": { "typescript": "2.4.0" }
我在做出这两个更改后运行了“npm install”命令,它成功运行。

3
在你的Subject类中:
修改这一行代码:
lift<R>(operator: Operator<T, R>): Observable<T>;

致:

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

1
这是rxjs和typescript之间的不匹配问题,使用"rxjs":"5.4.2"和"typescript":"~2.3.4"适用于我。

1

我已经在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和typescript版本的变化。


0

我遇到了同样的问题,并发现以下网站很有帮助https://www.georgephillipson.com/blog/jquery/setting-up-angular-2-in-visual-studio-2017/。它提供了逐步设置Angular MVC网站的说明,解释了如何修复本文所指的错误,并提供了一个链接到GitHub的完整代码。

我觉得这很有帮助,所以想让其他人知道

根据Zoe的帖子,我添加了更多关于为什么我认为这个链接可能有用的内容

该页面展示了如何更新RxJS以修复错误,还展示了如何检查您的计算机上是否安装了Node和NPM,并解释了如何添加TypeScript,然后展示了如何设置您的cshtml文件以显示Angular内容

enter image description here


欢迎提供解决方案的链接,但请确保您的答案即使没有链接也是有用的:在链接周围添加上下文,以便其他用户知道它是什么以及为什么存在,然后引用您链接的页面中最相关的部分,以防目标页面不可用。仅仅是一个链接的答案可能会被删除。 - Zoe stands with Ukraine

0
在 tsconfig.json 文件中,将其放置在 "compilerOptions" 中并将其设置为 true。
{
    "compilerOptions": true,
    "compilerOptions": {
        "noStrictGenericChecks": true
    }
}

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接