Erreur rxjs / Subject.d.ts: la classe 'Subject <T>' étend incorrectement la classe de base 'Observable <T>'

J'ai extrait un exemple de code de modèle de ce didacticiel et j'ai suivi les deux étapes ci-dessous pour commencer -

1. npm install // worked fine and created node_modules folder with all dependencies

2. npm start // a échoué avec l'erreur ci-dessous-

   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

Je vois que dans la déclaration de levée subject.d.ts est comme ci-dessous -

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

Et dans Observable.ts, il est défini comme ci-dessous-

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

Remarque: - 1. Je suis nouveau sur Angular2 et j'essaie de me procurer des choses.

2. L'erreur peut être due à des définitions incompatibles de la méthode de levage

3. J'ai lu ce fil de discussion github

4. Si j'ai besoin d'installer une version différente de rxjs, veuillez indiquer comment désinstaller et installer les bons rxjs.

Edit1: Je suis peut-être un peu en retard pour répondre ici mais j'obtiens toujours la même erreur même après avoir utilisé typescript 2.3.4 ou rxjs 6 alpha . Voici mon 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"
  }
}

Comme pour cela, vous avez besoin de la mise à jour de typescript 2.3.4 ou rxjs 6 alpha

allez dans votre fichier package.json dans la version typographique ou rxjs de votre mise à jour de projet. Exemple

"typescript": "2.3.4"

faire npm install

mise à jour (29/06/2017): -

Selon le "2.4.0"travail dactylographié des commentaires .

Comme d'autres l'ont souligné, ce problème est survenu à la suite de la vérification de type plus stricte des génériques introduite dans TypeScript 2.4. Cela a exposé une incohérence dans une définition de type RxJS et a par conséquent été corrigé dans la version 5.4.2 de RxJS . La solution idéale est donc de simplement passer à la version 5.4.2.

Si, pour une raison quelconque, vous ne pouvez pas mettre à niveau vers la version 5.4.2, vous devez à la place utiliser la solution d'Alan Haddad consistant à augmenter la déclaration de type pour la corriger pour votre propre projet. Ie ajouter cet extrait à votre application:

// 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>;
  }
}

Sa solution ne laissera aucun autre effet secondaire et est donc excellente. Les solutions proposées alternativement ont plus d'effets secondaires pour la configuration de votre projet et sont donc moins idéales:

• désactiver les vérifications génériques plus strictes avec l'indicateur du compilateur --noStrictGenericChecks . Cela la rendra cependant moins stricte pour votre propre application, ce que vous pouvez faire, mais pourrait introduire des définitions de type incohérentes comme cela a été le cas dans cette instance RxJS, ce qui pourrait à son tour introduire plus de bogues dans votre application.
• Ne pas vérifier les types dans les bibliothèques avec l'indicateur --skipLibCheck défini sur true. Ce n'est pas non plus idéal car il se peut que certaines erreurs de type ne soient pas signalées.
• Mise à niveau vers RxJS 6 Alpha - étant donné qu'il y a des changements majeurs, cela pourrait casser votre application de manière mal documentée, car elle est toujours en alpha. De plus, si vous avez d'autres dépendances comme Angular 2+, cela peut ne pas être vraiment une option prise en charge, brisant le cadre lui-même maintenant ou sur toute la ligne. Ce qui, je pense, est un problème encore plus difficile à résoudre.

Une approche de pansement admise consiste à ajouter ce qui suit à votre fichier tsconfig.json jusqu'à ce que les gens de RxJS décident de ce qu'ils veulent faire à propos de l'erreur lors de l'utilisation de TypeScript 2.4.1:

"compilerOptions": {

    "skipLibCheck": true,

 }

Vous pouvez temporairement contourner le problème à l'aide de l' extension de module

Le code suivant a résolu le problème pour moi. Une fois que RxJS a une version stable qui ne présente pas ce problème, elle doit être supprimée.

// 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>;
  }
}

S'il est peut-être ironique que RxJS lui-même fasse un usage aussi intensif de cette technique pour décrire sa propre forme, elle est en fait généralement applicable à un éventail de problèmes.

Bien qu'il y ait certainement des limites et des aspérités, une partie de ce qui rend cette technique puissante est que nous pouvons l'utiliser pour améliorer les déclarations existantes en les rendant plus sûres sans bifurquer et maintenir l'ensemble du fichier.

"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"
}

dans package.json "rxjs": "^5.4.2", et "typescript": "^ 2.3.4", alors npm install et ng servent son fonctionnement.

Juste un petit détail, pour tenter de mettre mes deux cents.

Le problème se pose lorsque nous mettons à jour Typescript vers la dernière version, qui était maintenant TypeScript 2.4.1 , ["car nous aimons les mises à niveau :) "], et comme mentionné par @ Jonnysai dans sa réponse et le lien fourni ici, il y a une discussion détaillée concernant le problème et ses correctifs.

Alors, que travaillé pour moi était:
1. Je devais Un installer tapuscrit 2.4.1 d' abord, en allant au Panneau de configuration > Programmes et fonctionnalités ...
2. Installez, à nouveau, tapuscrit 2.4.0 , puis assurez - vous que, dans package.jsonfichier, vous avez cette configuration, comme mentionné ici dans un détail un peu plus court. Vous pouvez télécharger TypeScript 2.4.0 à partir d' ici , pour Visual Studio 2015

Vous pouvez utiliser temporairement --noStrictGenericChecks indicateur pour contourner ce problème dans TypeScript 2.4.

Ceci est --noStrictGenericCheckssur la ligne de commande, ou juste "noStrictGenericChecks": truedans le "compilerOptions"champ danstsconfig.json .

Gardez à l'esprit que RxJS 6 aura ce problème corrigé.

Voir cette question similaire: Comment contourner cette erreur dans RxJS 5.x dans TypeScript 2.4?

Veuillez modifier la ligne de Subject.d.tsfichier suivante:

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

à:

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

Le type de retour devrait probablement être Observable<R>plutôt queObservable<T>

Gardez l'option noStrictGeneric true dans le fichier tsconfig.config

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

Ajoutez "noStrictGenericChecks": true dans le fichier tsconfig.json sous le nœud "compilerOptions" comme indiqué dans l'image ci-dessous et créez l'application. J'ai rencontré la même erreur après avoir ajouté cette erreur résolue.

J'ai trouvé le même problème et je l'ai résolu en utilisant "rxjs": "5.4.1" , "typescript": "~ 2.4.0" et en ajoutant "noStrictGenericChecks": true dans tsconfig.json.

RxJS 6 aura ce problème corrigé, mais comme solution de contournement temporaire, vous pouvez utiliser le noStrictGenericChecks option compilateur.

Dans tsconfig.json, mettez-le compilerOptionset réglez-le sur true.

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

Sur la ligne de commande c'est --noStrictGenericChecks .

Pourquoi cela se produit:

TypeScript 2.4 a un changement de rigueur et Subject ne monte pas vers le bon observable. La signature aurait vraiment dû être

(opérateur: Opérateur) => Observable

Cela sera corrigé dans RxJS 6.

Accédez au fichier Package.json et modifiez la configuration ci-dessous

...
  "rxjs": "5.4.1",
  "typescript": "~2.4.0"
...

Ça va marcher

L'utilisation de ce qui précède seul n'a pas aidé, cependant, en utilisant l'approche suivante: Comment contourner cette erreur «Le sujet étend incorrectement Observable» dans TypeScript 2.4 et RxJs 5

résolu les problèmes. Il est également mentionné que le problème a été résolu dans RxJs 6, il s'agit donc plus d'un correctif temporaire, ce qui m'a aidé à exécuter avec succès cet excellent exemple (qui compilé auparavant mais qui a donné l'erreur pendant le chargement): Développement d'applications Angular 4 avec Bootstrap 4 et TypeScript

réinstallation de rxjs -> npm install rxjs @ 6 rxjs-compat @ 6 --save

Maintenant, nous n'avons plus besoin du module natif ionique - nous n'avons besoin que de @ ionic-native / core. Courir

npm uninstall ionic-native --save

Cela résoudra votre problème.

il suffit d'ajouter

"noStrictGenericChecks": true

à votre tsconfig.json

merci la réponse de zmag et Rahul Sharma, ça marche! @zmag @Rahul Sharma

  "rxjs": "5.4.1",
  "typescript": "~2.4.0"

mon problème est le suivant:

typings/globals/core-js/index.d.ts:3:14 - error TS2300: Duplicate identifier

Apportez des modifications comme.

Accédez au fichier Package.json et modifiez la configuration ci-dessous

  "rxjs": "5.4.1",
  "typescript": "~2.4.0"

oui, le problème était avec TypeScript 2.4.1.Je viens de le désinstaller du panneau de configuration et cela fonctionne pour moi car Visual Studio 2017 l'a déjà.