Angular 12导入AngularFirestore报错：Module '@firebase/firestore'无导出成员'type'

你混用了Angular Fire的模块化API（AppModule中配置的provideFirestore）和旧版兼容API（组件中导入的AngularFirestore from @angular/fire/compat/firestore），两种API体系的依赖类型不兼容，导致出现Module '@firebase/firestore' has no exported member 'type'错误。

请二选一，不要同时混用两种API体系：

方案一：使用新模块化API（推荐） #

保持AppModule的现有配置不变，组件中改用Firebase官方模块化API操作数据：

// 组件TS文件中导入新API
import { Firestore, collection, addDoc } from '@angular/fire/firestore';

constructor(private firestore: Firestore) {}

// 添加文档的代码
async addDocument(myData: any) {
  try {
    const colRef = collection(this.firestore, 'collection-name');
    const docRef = await addDoc(colRef, myData);
    console.log('文档添加成功，ID：', docRef.id);
  } catch (err) {
    console.error('添加失败：', err);
  }
}

方案二：切换到旧版兼容模式 #

如果需要继续使用AngularFirestore，修改AppModule的配置为兼容模式：

// AppModule中替换导入
import { AngularFireModule } from '@angular/fire/compat';
import { AngularFirestoreModule } from '@angular/fire/compat/firestore';
import { environment } from '../environments/environment';

// 修改imports数组
imports: [
  ...
  AngularFireModule.initializeApp(environment.firebase),
  AngularFirestoreModule,
],

同时确保package.json中@angular/fire和firebase的版本匹配（Angular 12对应@angular/fire 7.x版本，firebase 9.x版本）。

内容的提问来源于stack exchange，提问作者Mima