wake-up-neo.com

fehler rxjs/Subject.d.ts: Klasse 'Subject <T>' erweitert Basisklasse 'Observable <T>' falsch

Ich habe Beispielvorlagencode aus diesem Tutorial extrahiert und unten zwei Schritte ausgeführt, um zu beginnen - 

  1. npm install // worked fine and created node_modules folder with all dependencies
  2. npm start/ fehlgeschlagen mit Fehler

    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 '<T, 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'.
      npm ERR! code ELIFECYCLE
      npm ERR! errno 2
    

Ich sehe das in der subject.d.ts Aufzugserklärung wie folgt:

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

Und in Observable.ts ist es definiert als

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

Anmerkung 1. Ich bin neu bei Angular2 und versuche, an Dinge heranzukommen.

  1. Der Fehler kann auf inkompatible Definitionen der Hebemethode zurückzuführen sein

  2. Ich habe diesen github-Thread gelesen

  3. Wenn ich eine andere Version von rxjs installieren muss, sagen Sie mir bitte, wie Sie die richtigen rxjs deinstallieren und installieren.

_/Edit1: Ich kann etwas spät antworten, bekomme aber immer noch die gleiche Fehlermeldung, auch wenn TypeScript 2.3.4oder _ oderrxjs 6 alpha verwendet wurde. Unten ist meine package.json,

{
  "name": "angular-quickstart",
  "version": "1.0.0",
  "scripts": {
    "start": "tsc && concurrently \"npm run tsc:w\" \"npm run lite\" ",
    "lite": "lite-server",
    "postinstall": "typings install",
    "tsc": "tsc",
    "tsc:w": "tsc -w",
    "typings": "typings"
  },
  "license": "ISC",
  "dependencies": {
    "@angular/common": "2.0.0",
    "@angular/compiler": "2.0.0",
    "@angular/core": "2.0.0",
    "@angular/forms": "2.0.0",
    "@angular/http": "2.0.0",
    "@angular/platform-browser": "2.0.0",
    "@angular/platform-browser-dynamic": "2.0.0",
    "@angular/router": "3.0.0",
    "@angular/upgrade": "2.0.0",
    "core-js": "^2.4.1",
    "reflect-metadata": "^0.1.3",
    "rxjs": "6.0.0-alpha.0",
    "systemjs": "0.19.27",
    "zone.js": "^0.6.23",
    "angular2-in-memory-web-api": "0.0.20",
    "bootstrap": "^3.3.6"
  },
  "devDependencies": {
    "concurrently": "^2.2.0",
    "lite-server": "^2.2.2",
    "TypeScript": "2.3.4",
    "typings": "^1.3.2"
  }
}
89
Deepak S

Gemäß this benötigen Sie ein Update TypeScript 2.3.4 oder rxjs 6 alpha

rufen Sie die Datei package.json in Ihrem Projekt-Update TypeScript oder der Version rxjs auf

"TypeScript": "2.3.4"

npm install 

update (29.06.2017): -

Wie in den Kommentaren beschrieben, funktioniert TypeScript "2.4.0".

69
CharanRoot

Wie bereits erwähnt, ist dieses Problem auf die strengere Typprüfung von Generika zurückzuführen, die in TypeScript 2.4 eingeführt wurde. Dies zeigte eine Inkonsistenz in einer RxJS-Typdefinition und wurde folglich in RxJS Version 5.4.2 behoben. Die ideale Lösung ist also ein Upgrade auf 5.4.2.

Wenn Sie aus irgendeinem Grund kein Upgrade auf 5.4.2 durchführen können, sollten Sie stattdessen die Lösung von Alan Haddad verwenden, um die Typdeklaration zu erweitern, um sie für Ihr eigenes Projekt zu korrigieren. D.h. Fügen Sie dieses Snippet Ihrer App hinzu:

// TODO: Remove this when RxJS releases a stable version with a correct declaration of `Subject`.
import { Operator } from 'rxjs/Operator';
import { Observable } from 'rxjs/Observable';

declare module 'rxjs/Subject' {
  interface Subject<T> {
    lift<R>(operator: Operator<T, R>): Observable<R>;
  }
}

Seine Lösung wird keine anderen Nebenwirkungen hinterlassen und ist somit großartig. Alternativ vorgeschlagene Lösungen haben mehr Nebenwirkungen für Ihren Projektaufbau und sind daher weniger ideal:

  • deaktivieren Sie die strengeren generischen Prüfungen mit dem Compiler-Flag --noStrictGenericChecks. Dies macht es jedoch für Ihre eigene App weniger strikt, was Sie tun können, führt jedoch möglicherweise inkonsistente Typdefinitionen wie in dieser RxJS-Instanz ein, die wiederum weitere Fehler in Ihrer App verursachen können.
  • Die Typen in Bibliotheken werden nicht überprüft, wenn das Flag --skipLibCheck auf true gesetzt ist. Dies ist auch nicht ideal, da möglicherweise keine Typfehler gemeldet werden.
  • Upgrade auf RxJS 6 Alpha - Wenn Änderungen vorgenommen werden, kann dies dazu führen, dass Ihre App auf schlecht dokumentierte Art und Weise beschädigt wird, da sie sich immer noch in Alpha befindet. Wenn Sie andere Abhängigkeiten wie Angular 2+ haben, ist dies möglicherweise nicht wirklich eine unterstützte Option, die das Framework selbst jetzt oder auf der anderen Seite zerstört. Was ich denke, ist ein noch schwieriger zu lösendes Problem.
24
Koslun

Ein bekanntes Hilfsmittel für die Bandhilfe besteht darin, der Datei tsconfig.json Folgendes hinzuzufügen, bis die RxJS-Benutzer entscheiden, was sie bei der Verwendung von TypeScript 2.4.1 tun wollen:

"compilerOptions": {

    "skipLibCheck": true,

 }
23
user3785010

Sie können das Problem vorübergehend umgehen, indem Sie Module Augmentation verwenden.

Der folgende Code hat das Problem für mich gelöst. Sobald RxJS eine stabile Version hat, die dieses Problem nicht aufweist, sollte es entfernt werden.

// augmentations.ts
import {Operator} from 'rxjs/Operator';
import {Observable} from 'rxjs/Observable';

// TODO: Remove this when a stable release of RxJS without the bug is available.
declare module 'rxjs/Subject' {
  interface Subject<T> {
    lift<R>(operator: Operator<T, R>): Observable<R>;
  }
}

Während es vielleicht ironisch ist, dass RxJS selbst diese Technik zur Beschreibung seiner eigenen Form so stark einsetzt, ist es tatsächlich allgemein auf eine Reihe von Problemen anwendbar.

Zwar gibt es sicherlich Grenzen und Ecken und Kanten, aber ein Teil der Leistungsfähigkeit dieser Technik besteht darin, dass wir vorhandene Deklarationen verbessern können, um sie sicherer zu machen, ohne die gesamte Datei zu fällen und zu pflegen.

19
Aluan Haddad

Nur ein bisschen Detail, um zu versuchen, meine zwei Cents einzugeben.

Das Problem entsteht, wenn wir TypeScript auf die neueste Version aktualisieren, die jetzt TypeScript 2.4.1 , ["wie wir die Upgrades lieben:)"] und Da in seiner Antwort und dem dort angegebenen Link von @Jonnysai erwähnt wird, gibt es eine ausführliche Diskussion über das Problem und seine Korrekturen.

Also, was gearbeitet für mich war:
1. Ich musste zuerst Un installierenTypeScript 2.4.1 _, indem Sie zu Systemsteuerung> Programme und Funktionen ...gehen. _
2. Installieren Sie erneut TypeScript 2.4.0 und stellen Sie sicher, dass Sie dies in der package.json-Datei haben

enter image description here
konfiguration, wie erwähnt here in einem etwas kürzeren Detail.

Sie können TypeScript 2.4.0 von hier , für Visual Studio 2015 herunterladen.

8
Irf
"dependencies": {
"@angular/animations": "^4.3.1",
"@angular/common": "^4.3.1",
"@angular/compiler": "^4.3.1",
"@angular/compiler-cli": "^4.3.1",
"@angular/core": "^4.3.1",
"@angular/forms": "^4.3.1",
"@angular/http": "^4.3.1",
"@angular/platform-browser": "^4.3.1",
"@angular/platform-browser-dynamic": "^4.3.1",
"@angular/platform-server": "^4.3.1",
"@angular/router": "^4.3.1",
"core-js": "^2.4.1",
"rxjs": "^5.4.2",
"ts-helpers": "^1.1.1",
"zone.js": "^0.7.2"
},
"devDependencies": {
"@angular/compiler-cli": "^2.3.1",
"@types/jasmine": "2.5.38",
"@types/node": "^6.0.42",
"angular-cli": "1.0.0-beta.28.3",
"codelyzer": "~2.0.0-beta.1",
"jasmine-core": "2.5.2",
"jasmine-spec-reporter": "2.5.0",
"karma": "1.2.0",
"karma-chrome-launcher": "^2.0.0",
"karma-cli": "^1.0.1",
"karma-jasmine": "^1.0.2",
"karma-remap-istanbul": "^0.2.1",
"protractor": "~4.0.13",
"ts-node": "1.2.1",
"tslint": "^4.3.0",
"TypeScript": "^2.3.4",
"typings": "^1.3.2"
}

in package.json "rxjs": "^5.4.2", und "TypeScript": "^ 2.3.4", dann npm install und ng dienen dessen Funktion.

8
ketan chaudhari

Sie können das Flag --noStrictGenericChecks vorübergehend verwenden, um dies in TypeScript 2.4 zu umgehen.

Dies ist --noStrictGenericChecks in der Befehlszeile oder nur "noStrictGenericChecks": true im Feld "compilerOptions" in tsconfig.json.

Denken Sie daran, dass dies bei RxJS 6 korrigiert wird.

Siehe diese ähnliche Frage: Wie kann ich diesen Fehler in RxJS 5.x in TypeScript 2.4 umgehen?

5

Behalten Sie die Option noStrictGeneric in der Datei tsconfig.config bei 

{
    "compilerOptions": {
        "noStrictGenericChecks": true
    }
}
3
Jigar Tanna

Bitte ändern Sie die folgende Zeile der Subject.d.ts-Datei:

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

zu:

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

Der Rückgabetyp sollte wahrscheinlich Observable<R> und nicht Observable<T> sein.

3
user8709803

Fügen Sie "noStrictGenericChecks" hinzu: true in der Datei "tsconfig.json" unter dem Knoten "" compilerOptions ", wie in der folgenden Abbildung gezeigt. Ich habe denselben Fehler erlebt, nachdem ich diesen Fehler behoben habe .  enter image description here

2
Akshay Bagi

Ich fand dasselbe Problem und löste es durch die Verwendung von "rxjs": "5.4.1" , "TypeScript": "~ 2.4.0" und fügte "noStrictGenericChecks": true hinzu tsconfig.json.

In RxJS 6 ist dies behoben, aber als temporäre Problemumgehung können Sie die Compileroption noStrictGenericChecks verwenden.

Setzen Sie es in tsconfig.json in compilerOptions und setzen Sie es auf true.

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

In der Befehlszeile steht --noStrictGenericChecks.

Warum es passiert:

TypeScript 2.4 hat eine Änderung der Strenge und Betreff erhebt nicht das richtige Observable. Die Unterschrift hätte eigentlich sein sollen

(Operator: Operator) => Beobachtbar

Dies wird in RxJS 6 behoben.

1

einfach hinzufügen

"noStrictGenericChecks": true

zu Ihrer tsconfig.json

0
Miguel Afonso

Die alleinige Verwendung des oben genannten Ansatzes hat jedoch nicht geholfen, wenn Sie den folgenden Ansatz verwenden: Wie komme ich an den Fehler "Betreff erweitert Observable" falsch in TypeScript 2.4 und RxJs 5

gelöst die probleme. Dort wird auch erwähnt, dass das Problem in RxJs 6 behoben wurde. Es handelt sich also eher um eine temporäre Korrektur, die mir beim erfolgreichen Ausführen dieses großartigen Beispiels (das zuvor kompiliert wurde, den Fehler jedoch während der Ladezeit ergab) geholfen hat: Angular 4-Anwendungsentwicklung mit Bootstrap 4 und TypeScript

0
Gil Shapir

Jetzt brauchen wir kein ionisch-natives Modul - wir brauchen nur @ ionic-native/core . Run

npm uninstall ionic-native --save

Es wird Ihr Problem lösen ..

0
Shubham Pandey

rxjs neu installieren -> npm Rxjs @ 6 installieren Rxjs-compat @ 6 --save

0
Yakup Ad