angular - incorrectly - Error de rxjs/Subject.d.ts: la clase ''Asunto<T>'' extiende incorrectamente la clase base ''Observable<T>''

class ''subject<t>'' incorrectly extends base class ''observable<t>''

Question

Extraje el código de plantilla de muestra de este tutorial e hice dos pasos a continuación para comenzar:

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

2. npm start // falló con el siguiente error-

   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

Veo que en el sujeto.d.ts la declaración de elevación es la siguiente:

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

Y en Observable.ts se define como a continuación:

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

Nota: - 1. Soy nuevo en Angular2 y estoy tratando de conseguir cosas.

2. El error puede deberse a definiciones incompatibles del método de elevación

3. Leí este hilo de github

4. Si necesito instalar alguna versión diferente de rxjs, por favor dígame cómo desinstalar e instalar los rxjs correctos.

Edit1: es posible que tarde un poco en responder aquí, pero sigo recibiendo el mismo error incluso después de usar el mecanografiado 2.3.4 o rxjs 6 alpha . A continuación se muestra mi 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"
  }
}

Answer 1

Agregue "noStrictGenericChecks": verdadero en el archivo tsconfig.json en el nodo "compilerOptions" como se muestra en la siguiente imagen y aplicación de compilación. Me he enfrentado al mismo error después de agregar este error resuelto.

Answer 2

Ahora no necesitamos el módulo iónico-nativo, solo necesitamos @ ionic-native / core. correr

npm uninstall ionic-native --save

Resolverá su problema.

Answer 3

Cambie la siguiente línea del archivo Subject.d.ts :

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

a:

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

El tipo de retorno probablemente debería ser Observable<R> lugar de Observable<T>

Answer 4

Como otros han señalado, este problema surgió como consecuencia de la verificación más estricta de los genéricos introducida en TypeScript 2.4. Esto expuso una inconsistencia en una definición de tipo RxJS y, en consecuencia, se corrigió en [email protected] . Entonces, la solución ideal es simplemente actualizar a 5.4.2.

Si, por alguna razón, no puede actualizar a 5.4.2, debe utilizar la solución de Alan Haddad de aumentar la declaración de tipo para arreglarlo para su propio proyecto. Es decir, agregue este fragmento a su aplicación:

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

Su solución no dejará otros efectos secundarios y, por lo tanto, es excelente. Alternativamente, las soluciones propuestas tienen más efectos secundarios para la configuración de su proyecto y, por lo tanto, son menos ideales:

• apague las verificaciones genéricas más estrictas con el indicador del compilador --noStrictGenericChecks . Sin embargo, esto hará que sea menos estricto para su propia aplicación, lo que puede hacer, pero podría introducir definiciones de tipo inconsistentes como lo hizo en esta instancia de RxJS que a su vez podría introducir más errores en su aplicación.
• No verificar los tipos en las bibliotecas con el indicador --skipLibCheck establecido en verdadero. Esto tampoco es ideal, ya que es posible que no reciba algunos errores de tipo.
• Actualización a RxJS 6 Alpha: dado que hay cambios importantes, esto podría dañar su aplicación de manera mal documentada, ya que todavía está en alfa. Además, si tiene otras dependencias como Angular 2+, esta podría no ser una opción compatible, rompiendo el marco en sí mismo o más adelante. Lo cual creo que es un problema aún más difícil de resolver.

Answer 5

El uso de lo anterior solo no ayudó, sin embargo, con el siguiente enfoque: ¿Cómo puedo evitar este error "El sujeto extiende incorrectamente el Observable" en TypeScript 2.4 y RxJs 5

resuelto los problemas. También se menciona allí que el problema se ha solucionado en RxJs 6, por lo que se trata más de una solución temporal, que me ayudó a ejecutar con éxito este gran ejemplo (que se compiló antes pero dio el error durante el tiempo de carga): desarrollo de la aplicación Angular 4 con Bootstrap 4 y TypeScript

Answer 6

Encontré el mismo problema y lo resolví usando "rxjs": "5.4.1" , "typecript": "~ 2.4.0" y agregando "noStrictGenericChecks": true en tsconfig.json.

Answer 7

Mantenga la opción noStrictGeneric verdadera en el archivo tsconfig.config

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

Answer 8

Puede solucionar el problema temporalmente utilizando el Módulo de Aumento

El siguiente código resolvió el problema por mí. Una vez que RxJS tenga una versión estable que no presente este problema, debe eliminarse.

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

Si bien es quizás irónico que RxJS haga un uso tan intensivo de esta técnica para describir su propia forma, en realidad es aplicable en general a una variedad de problemas.

Si bien existen límites y bordes ásperos, parte de lo que hace que esta técnica sea poderosa es que podemos usarla para mejorar las declaraciones existentes, haciéndolas más seguras sin tener que bifurcar y mantener todo el archivo.

Answer 9

Puede usar temporalmente el indicador --noStrictGenericChecks para --noStrictGenericChecks esto en TypeScript 2.4.

Esto es --noStrictGenericChecks en la línea de comando, o simplemente "noStrictGenericChecks": true en el campo "compilerOptions" en tsconfig.json .

Tenga en cuenta que RxJS 6 tendrá esto corregido.

Vea esta pregunta similar: ¿Cómo puedo evitar este error en RxJS 5.x en TypeScript 2.4?

Answer 10

RxJS 6 lo solucionará, pero como solución temporal, puede usar la opción del compilador noStrictGenericChecks .

En tsconfig.json , tsconfig.json en compilerOptions y tsconfig.json como verdadero.

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

En la línea de comando es --noStrictGenericChecks .

Por qué está sucediendo:

TypeScript 2.4 tiene un cambio de rigor, y el Asunto no se está elevando al Observable correcto. La firma realmente debería haber sido

(operador: operador) => observable

Esto se solucionará en RxJS 6.

Answer 11

Sí, el problema era con TypeScript 2.4.1. Simplemente lo desinstalé del Panel de control y funciona para mí, ya que Visual Studio 2017 ya lo tiene.

Answer 12

Según github.com/Microsoft/TypeScript/issues/16593 , necesita actualizar el mecanografiado 2.3.4 o rxjs 6 alpha

vaya al archivo su package.json en el mecanografiado de actualización del proyecto o la versión rxjs. Ejemplo

"typescript": "2.3.4"

npm install

actualización (29/06/2017): -

Según el mecanografiado de comentarios "2.4.0" funcionando.

Answer 13

Solo un poco de detalle, en un intento de poner mis dos centavos.

El problema surge cuando actualizamos TypeScript a la última versión, que ahora era TypeScript 2.4.1 , ["como nos encantan las actualizaciones :) "], y según lo mencionado por @ Jonnysai en su respuesta y el enlace proporcionado allí, hay Una discusión detallada sobre el problema y sus soluciones.

Entonces, lo que funcionó para mí fue:
1. Primero tuve que desinstalar TypeScript 2.4.1 , yendo a Panel de control > Programas y características ...
2. Instale, de nuevo, TypeScript 2.4.0 , y luego asegúrese de que, en el archivo package.json , tenga esto


configuración, como se menciona here en un detalle bastante más corto.

Puede descargar TypeScript 2.4.0 desde aquí , para Visual Studio 2015

Answer 14

Un enfoque de curita admitido es agregar lo siguiente a su archivo tsconfig.json hasta que la gente de RxJS decida qué quieren hacer sobre el error al usar TypeScript 2.4.1:

"compilerOptions": {

    "skipLibCheck": true,

 }

Answer 15

Vaya al archivo Package.json y modifique la siguiente configuración

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

Funcionará

Answer 16

reinstalar rxjs -> npm instalar rxjs @ 6 rxjs-compat @ 6 --save

Answer 17

solo agrega

"noStrictGenericChecks": true

a su tsconfig.json

Answer 18

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

en package.json "rxjs": "^5.4.2", y "mecanografiado": "^ 2.3.4", luego npm install y ng sirven para que funcione.