Erreur de configuration de la base de feu Angular8 '@ angular / fire / angularfire2'

17

Lorsque j'essaie de "ng servir" après avoir configuré angular avec firebase, j'ai eu l'erreur. Même si j'ai googlé ce message d'erreur mais que je n'ai rien trouvé. Dans le message d'erreur, ce problème est lié à la bibliothèque elle-même.

user@user-MacBookPro post % ng serve
10% building 3/3 modules 0 active wds」: Project is running at http://localhost:4200/webpack-dev-server/
 wds」: webpack output is served from /
 wds」: 404s will fallback to //index.html

chunk {main} main.js, main.js.map (main) 2.15 kB [initial] [rendered]
chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 127 kB [initial] [rendered]
chunk {runtime} runtime.js, runtime.js.map (runtime) 6.15 kB [entry] [rendered]
chunk {styles} styles.js, styles.js.map (styles) 9.78 kB [initial] [rendered]
chunk {vendor} vendor.js, vendor.js.map (vendor) 340 kB [initial] [rendered]
Date: 2020-02-10T01:58:36.888Z - Hash: 259e06990402b2940abe - Time: 3542ms

ERROR in node_modules/@angular/fire/angularfire2.d.ts:37:49 - error TS2344: Type 'T[K]' does not satisfy the constraint '(...args: any) => any'.
  Type 'T[{ [K in keyof T]: T[K] extends Function ? K : never; }[keyof T]]' is not assignable to type '(...args: any) => any'.
    Type 'T[T[keyof T] extends Function ? keyof T : never]' is not assignable to type '(...args: any) => any'.
      Type 'T[keyof T]' is not assignable to type '(...args: any) => any'.
        Type 'T[string] | T[number] | T[symbol]' is not assignable to type '(...args: any) => any'.
          Type 'T[string]' is not assignable to type '(...args: any) => any'.

37     [K in FunctionPropertyNames<T>]: ReturnType<T[K]> extends Promise<any> ? K : never;
                                                   ~~~~
node_modules/@angular/fire/angularfire2.d.ts:40:49 - error TS2344: Type 'T[K]' does not satisfy the constraint '(...args: any) => any'.
  Type 'T[{ [K in keyof T]: T[K] extends Function ? K : never; }[keyof T]]' is not assignable to type '(...args: any) => any'.
    Type 'T[T[keyof T] extends Function ? keyof T : never]' is not assignable to type '(...args: any) => any'.
      Type 'T[keyof T]' is not assignable to type '(...args: any) => any'.
        Type 'T[string] | T[number] | T[symbol]' is not assignable to type '(...args: any) => any'.
          Type 'T[string]' is not assignable to type '(...args: any) => any'.

40     [K in FunctionPropertyNames<T>]: ReturnType<T[K]> extends Promise<any> ? never : K;
                                                   ~~~~
node_modules/@angular/fire/angularfire2.d.ts:48:78 - error TS2344: Type 'T[K]' does not satisfy the constraint '(...args: any) => any'.
  Type 'T[{ [K in { [K in keyof T]: T[K] extends Function ? K : never; }[keyof T]]: ReturnType<T[K]> extends Promise<any> ? never : K; }[{ [K in keyof T]: T[K] extends Function ? K : never; }[keyof T]]]' is not assignable to type '(...args: any) => any'.
    Type 'T[ReturnType<T[{ [K in keyof T]: T[K] extends Function ? K : never; }[keyof T]]> extends Promise<any> ? never : { [K in keyof T]: T[K] extends Function ? K : never; }[keyof T]]' is not assignable to type '(...args: any) => any'.
      Type 'T[{ [K in keyof T]: T[K] extends Function ? K : never; }[keyof T]]' is not assignable to type '(...args: any) => any'.
        Type 'T[T[keyof T] extends Function ? keyof T : never]' is not assignable to type '(...args: any) => any'.
          Type 'T[keyof T]' is not assignable to type '(...args: any) => any'.
            Type 'T[string] | T[number] | T[symbol]' is not assignable to type '(...args: any) => any'.
              Type 'T[string]' is not assignable to type '(...args: any) => any'.

48     [K in NonPromiseReturningFunctionPropertyNames<T>]: (...args: Parameters<T[K]>) => Promise<ReturnType<T[K]>>;
                                                                                ~~~~
node_modules/@angular/fire/angularfire2.d.ts:48:107 - error TS2344: Type 'T[K]' does not satisfy the constraint '(...args: any) => any'.
  Type 'T[{ [K in { [K in keyof T]: T[K] extends Function ? K : never; }[keyof T]]: ReturnType<T[K]> extends Promise<any> ? never : K; }[{ [K in keyof T]: T[K] extends Function ? K : never; }[keyof T]]]' is not assignable to type '(...args: any) => any'.
    Type 'T[ReturnType<T[{ [K in keyof T]: T[K] extends Function ? K : never; }[keyof T]]> extends Promise<any> ? never : { [K in keyof T]: T[K] extends Function ? K : never; }[keyof T]]' is not assignable to type '(...args: any) => any'.
      Type 'T[{ [K in keyof T]: T[K] extends Function ? K : never; }[keyof T]]' is not assignable to type '(...args: any) => any'.
        Type 'T[T[keyof T] extends Function ? keyof T : never]' is not assignable to type '(...args: any) => any'.
          Type 'T[keyof T]' is not assignable to type '(...args: any) => any'.
            Type 'T[string] | T[number] | T[symbol]' is not assignable to type '(...args: any) => any'.
              Type 'T[string]' is not assignable to type '(...args: any) => any'.

48     [K in NonPromiseReturningFunctionPropertyNames<T>]: (...args: Parameters<T[K]>) => Promise<ReturnType<T[K]>>;
                                                                                                             ~~~~
node_modules/@angular/fire/angularfire2.d.ts:50:75 - error TS2344: Type 'T[K]' does not satisfy the constraint '(...args: any) => any'.
  Type 'T[{ [K in { [K in keyof T]: T[K] extends Function ? K : never; }[keyof T]]: ReturnType<T[K]> extends Promise<any> ? K : never; }[{ [K in keyof T]: T[K] extends Function ? K : never; }[keyof T]]]' is not assignable to type '(...args: any) => any'.
    Type 'T[ReturnType<T[{ [K in keyof T]: T[K] extends Function ? K : never; }[keyof T]]> extends Promise<any> ? { [K in keyof T]: T[K] extends Function ? K : never; }[keyof T] : never]' is not assignable to type '(...args: any) => any'.
      Type 'T[{ [K in keyof T]: T[K] extends Function ? K : never; }[keyof T]]' is not assignable to type '(...args: any) => any'.

50     [K in PromiseReturningFunctionPropertyNames<T>]: (...args: Parameters<T[K]>) => ReturnType<T[K]>;
                                                                             ~~~~
node_modules/@angular/fire/angularfire2.d.ts:50:96 - error TS2344: Type 'T[K]' does not satisfy the constraint '(...args: any) => any'.
  Type 'T[{ [K in { [K in keyof T]: T[K] extends Function ? K : never; }[keyof T]]: ReturnType<T[K]> extends Promise<any> ? K : never; }[{ [K in keyof T]: T[K] extends Function ? K : never; }[keyof T]]]' is not assignable to type '(...args: any) => any'.
    Type 'T[ReturnType<T[{ [K in keyof T]: T[K] extends Function ? K : never; }[keyof T]]> extends Promise<any> ? { [K in keyof T]: T[K] extends Function ? K : never; }[keyof T] : never]' is not assignable to type '(...args: any) => any'.
      Type 'T[{ [K in keyof T]: T[K] extends Function ? K : never; }[keyof T]]' is not assignable to type '(...args: any) => any'.

50     [K in PromiseReturningFunctionPropertyNames<T>]: (...args: Parameters<T[K]>) => ReturnType<T[K]>;
                                                                                                  ~~~~

** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **
 wdm」: Failed to compile.

Il s'agit d'un fichier package.json. Ce projet est basé sur Angular8, Firebase version 6.

{
  "name": "post",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "~8.2.14",
    "@angular/common": "~8.2.14",
    "@angular/compiler": "~8.2.14",
    "@angular/core": "~8.2.14",
    "@angular/fire": "^6.0.0-rc.1",
    "@angular/forms": "~8.2.14",
    "@angular/platform-browser": "~8.2.14",
    "@angular/platform-browser-dynamic": "~8.2.14",
    "@angular/router": "~8.2.14",
    "firebase": "^7.8.1",
    "rxjs": "~6.4.0",
    "tslib": "^1.10.0",
    "zone.js": "~0.9.1"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.803.24",
    "@angular/cli": "~8.3.24",
    "@angular/compiler-cli": "~8.2.14",
    "@angular/language-service": "~8.2.14",
    "@types/node": "~8.9.4",
    "@types/jasmine": "~3.3.8",
    "@types/jasminewd2": "~2.0.3",
    "codelyzer": "^5.0.0",
    "jasmine-core": "~3.4.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~4.1.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.1",
    "karma-jasmine": "~2.0.1",
    "karma-jasmine-html-reporter": "^1.4.0",
    "protractor": "~5.4.0",
    "ts-node": "~7.0.0",
    "tslint": "~5.15.0",
    "typescript": "~3.5.3",
    "@angular-devkit/architect": "^0.900.0-0 || ^0.900.0",
    "firebase-tools": "^7.12.1",
    "fuzzy": "^0.1.3",
    "inquirer": "^6.2.2",
    "inquirer-autocomplete-prompt": "^1.0.1"
  }
}
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { environment } from 'src/environments/environment';

//angular-fire
import { AngularFireModule } from "@angular/fire";
import { AngularFirestoreModule } from "@angular/fire/firestore";
//      in version 6, StorageBucket changes to BUCKET
import { AngularFireStorageModule, BUCKET  } from "@angular/fire/storage";

// component list
import { AddpostComponent } from "../app/addpost/addpost.component";
import { MainComponent } from "../app/main/main.component";
import { PostComponent } from "../app/post/post.component";


// forms module for AddpostComponent
import { FormsModule, ReactiveFormsModule } from "@angular/forms";

import {ServiceService  } from "./service.service";


@NgModule({
  declarations: [
    AppComponent,
    AddpostComponent,
    MainComponent,
    PostComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    AngularFireModule.initializeApp(environment.firebaseConfig),
    AngularFirestoreModule,
    AngularFireStorageModule,
    FormsModule,
    ReactiveFormsModule
  ],
  providers: [{ provide: BUCKET, useValue: 'gs://angular-firebase-rxjs.appspot.com' }, ServiceService],
  bootstrap: [AppComponent]
})
export class AppModule { }
Cadres
la source
Pouvez-vous partager plus d'informations comme l'appel d'angularfire2 sur un composant ou un service?
KingDarBoja
@KingDarBoja Merci! J'ai mis à jour le post mais il n'y a aucune mention angularfire2 en particulier.
Cadres

Réponses:

63

Cette erreur est due au type TypeScript vérifiant le fichier de définitions de la bibliothèque AngularFire.

Notez que les erreurs proviennent de node_modules/@angular/fire/angularfire2.d.ts:37:49.

Pour éviter cette erreur, vous devez définir certaines options dans tsconfig.json.

tsconfig:

{
  //...
  compilerOptions: {
    "skipLibCheck": true,
    //...
  }
}

skipLibCheck: Ignore la vérification de type des fichiers de déclaration.

Plus d'informations sur l' option skipLibCheck .

C_Ogoo
la source