我启动新的 Ionic/Angular 项目并添加 @Angular/fire 包。
当我运行“ionicserve”时，我收到以下错误：
Error: node_modules/@angular/fire/compat/firestore/interfaces.d.ts:13:18 - error TS2430: Interface 'DocumentSnapshotExists<T>' incorrectly extends interface 'DocumentSnapshot<DocumentData>'.
The types returned by 'data(...)' are incompatible between these types.
Type 'T' is not assignable to type 'DocumentData | undefined'.
Type 'T' is not assignable to type 'DocumentData'.
13 export interface DocumentSnapshotExists<T> extends firebase.firestore.DocumentSnapshot {
node_modules/@angular/fire/compat/firestore/interfaces.d.ts:13:41
13 export interface DocumentSnapshotExists<T> extends firebase.firestore.DocumentSnapshot {
This type parameter might need an `extends firebase.firestore.DocumentData` constraint.
node_modules/@angular/fire/compat/firestore/interfaces.d.ts:13:41
13 export interface DocumentSnapshotExists<T> extends firebase.firestore.DocumentSnapshot {
This type parameter might need an `extends firebase.firestore.DocumentData | undefined` constraint.
Error: node_modules/@angular/fire/compat/firestore/interfaces.d.ts:23:18 - error TS2430: Interface 'QueryDocumentSnapshot<T>' incorrectly extends interface 'QueryDocumentSnapshot<DocumentData>'.
The types returned by 'data(...)' are incompatible between these types.
Type 'T' is not assignable to type 'DocumentData'.
23 export interface QueryDocumentSnapshot<T> extends firebase.firestore.QueryDocumentSnapshot {
node_modules/@angular/fire/compat/firestore/interfaces.d.ts:23:40
23 export interface QueryDocumentSnapshot<T> extends firebase.firestore.QueryDocumentSnapshot {
This type parameter might need an `extends firebase.firestore.DocumentData` constraint.
Error: node_modules/@angular/fire/compat/firestore/interfaces.d.ts:26:18 - error TS2430: Interface 'QuerySnapshot<T>' incorrectly extends interface 'QuerySnapshot<DocumentData>'.
Types of property 'docs' are incompatible.
Type 'QueryDocumentSnapshot<T>[]' is not assignable to type 'QueryDocumentSnapshot<DocumentData>[]'.
Type 'QueryDocumentSnapshot<T>' is not assignable to type 'QueryDocumentSnapshot<DocumentData>'.
The types returned by 'data(...)' are incompatible between these types.
Type 'T' is not assignable to type 'DocumentData'.
26 export interface QuerySnapshot<T> extends firebase.firestore.QuerySnapshot {
node_modules/@angular/fire/compat/firestore/interfaces.d.ts:26:32
26 export interface QuerySnapshot<T> extends firebase.firestore.QuerySnapshot {
This type parameter might need an `extends firebase.firestore.DocumentData` constraint.
Error: node_modules/@angular/fire/compat/firestore/interfaces.d.ts:29:18 - error TS2430: Interface 'DocumentChange<T>' incorrectly extends interface 'DocumentChange<DocumentData>'.
The types returned by 'doc.data(...)' are incompatible between these types.
Type 'T' is not assignable to type 'DocumentData'.
29 export interface DocumentChange<T> extends firebase.firestore.DocumentChange {
node_modules/@angular/fire/compat/firestore/interfaces.d.ts:29:33
29 export interface DocumentChange<T> extends firebase.firestore.DocumentChange {
This type parameter might need an `extends firebase.firestore.DocumentData` constraint.
这是我的配置。 包.json:
"@angular/common": "^15.0.0",
"@angular/core": "^15.0.0",
"@angular/fire": "^7.5.0",
"@angular/forms": "^15.0.0",
"@angular/platform-browser": "^15.0.0",
"@angular/platform-browser-dynamic": "^15.0.0",
"@angular/router": "^15.0.0",
"@angular/service-worker": "^15.0.0",
"@capacitor/app": "4.1.1",
"@capacitor/core": "4.6.1",
"@capacitor/haptics": "4.1.0",
"@capacitor/keyboard": "4.1.0",
"@capacitor/status-bar": "4.1.1",
"@ionic/angular": "^6.1.9",
"@ionic/pwa-elements": "^3.1.1",
"ionicons": "^6.0.3",
"rxjs": "~7.5.0",
"tslib": "^2.3.0",
"zone.js": "~0.11.4"
Package-lock.json：
"node_modules/@angular/fire": {
"version": "7.5.0",
...
"dependencies": {
"...
"firebase": "^9.8.0",
...
},
"node_modules/firebase": {
"version": "9.15.0",
"resolved": "https://registry.npmjs.org/firebase/-/firebase-9.15.0.tgz",
...
},
app.module.ts：
@NgModule({
declarations: [AppComponent],
imports: [
BrowserModule,
IonicModule.forRoot(),
AppRoutingModule,
AngularFireModule.initializeApp(environment.firebaseConfig),
AngularFireAuthModule,
AngularFireDatabaseModule,
AngularFireStorageModule,
AngularFirestoreModule,
AngularFireFunctionsModule
],
providers: [{ provide: RouteReuseStrategy, useClass: IonicRouteStrategy }],
bootstrap: [AppComponent],
})
export class AppModule { }
有什么想法可以解决吗？
我读过类似的问题，但针对的是旧版本，而不是我的。
这解决了我的问题。
在 tsconfig.json
添加以下内容{
"compilerOptions": { "skipLibCheck": true, }
}
我按照此链接
中的说明通过更改“node_modules/@angular/fire/compat/firestore/interfaces.d.ts”解决了问题将其更改为
node_modules/@angular/fire/compat/firestore/interfaces.d.ts
export interface DocumentSnapshotExists<T> extends firebase.firestore.DocumentSnapshot {
readonly exists: true;
data(options?: SnapshotOptions): T;
}
export interface QueryDocumentSnapshot<T> extends firebase.firestore.QueryDocumentSnapshot {
data(options?: SnapshotOptions): T;
}
export interface QuerySnapshot<T> extends firebase.firestore.QuerySnapshot {
readonly docs: QueryDocumentSnapshot<T>[];
}
export interface DocumentChange<T> extends firebase.firestore.DocumentChange {
readonly doc: QueryDocumentSnapshot<T>;
}
到
export interface DocumentSnapshotExists<T> extends firebase.firestore.DocumentSnapshot <T>{
readonly exists: true;
data(options?: SnapshotOptions): T;
}
export interface QueryDocumentSnapshot<T> extends firebase.firestore.QueryDocumentSnapshot <T>{
data(options?: SnapshotOptions): T;
}
export interface QuerySnapshot<T> extends firebase.firestore.QuerySnapshot <T>{
readonly docs: QueryDocumentSnapshot<T>[];
}
export interface DocumentChange<T> extends firebase.firestore.DocumentChange <T> {
readonly doc: QueryDocumentSnapshot<T>;
}
当您想要将项目部署到 Netlify 等网站时。将 {"skipLibCheck": true } 添加到 tsconfig.json 中的 compilerOptions 是唯一的选择。