Angular 13 Firebase不会编译-没有带Firebase的导出成员

Question

免责声明：我已经审阅了这些帖子，它们似乎没有回答我的问题：AngularFireModule和AngularFireDatabaseModule在@angular/fire 中找不到

当试图编译angular 10项目时，firebase没有导出成员错误

node_modules/@angular/firefirebase.app.module.d.ts中存在错误？

我的包.json:中当前的角度依赖项

"dependencies": {
        "@angular/animations": "~13.0.0",
        "@angular/common": "~13.0.0",
        "@angular/compiler": "~13.0.0",
        "@angular/core": "~13.0.0",
        "@angular/fire": "^7.0.0",
        "@angular/forms": "~13.0.0",
        "@angular/platform-browser": "~13.0.0",
        "@angular/platform-browser-dynamic": "~13.0.0",
        "@angular/router": "~13.0.0",
        "firebase": "^8.10.0",
        "rxjs": "~7.4.0",
        "tslib": "^2.3.0",
        "zone.js": "~0.11.4"
    },

进口和报关：

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import {firebase} from '@firebase/app';
import { AngularFireModule} from '@angular/fire/compat'
import { AngularFireDatabaseModule } from '@angular/fire/compat/database';
import { AngularFirestoreModule } from '@angular/fire/compat/firestore';
import { environment } from '../environments/environment';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { HomepageComponent } from './homepage/homepage.component';
import { AddPostComponent } from './components/add-post/add-post.component';
import { PostDetailsComponent } from './components/post-details/post-details.component';
import { PostListComponent } from './components/post-list/post-list.component';

@NgModule({
  declarations: [
    AppComponent,
    HomepageComponent,
    AddPostComponent,
    PostDetailsComponent,
    PostListComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    FormsModule,
    AngularFireModule.initializeApp(environment.firebase),
    AngularFirestoreModule,
    AngularFireDatabaseModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

根据以上帖子，这种@angular/fire和firebase的组合应该有效。我有7.0.0+，这意味着我清理了@angular/fire模块的compat部分，我有firebase 8.X.X，我认为这是使用fire 7的正确级别的firebase。

尽管如此，我还是得到了以下错误的列表：

./node_modules/@angular/fire/fesm2015/angular-fire.js:17:98-111 - Error: export 'isSupported' (imported as 'isSupported$1') was not found in 'firebase/messaging' (module has no exports)
./node_modules/@angular/fire/fesm2015/angular-fire.js:18:104-117 - Error: export 'isSupported' (imported as 'isSupported$2') was not found in 'firebase/remote-config' (module has no exports)
./node_modules/@angular/fire/fesm2015/angular-fire.js:84:29-36 - Error: export 'getApps' (imported as 'getApps') was not found in 'firebase/app' (possible exports: default)

firebase有什么我不理解的地方吗？或者我应该降级到哪个版本才能编译这个应用程序？

很抱歉，如果答案在其中一个发布的链接中，我只是不明白。如果可以避免的话，我会尽量避免将两个模块降级到更低的版本，但如果这是唯一的答案，那就是唯一的答案。我只是想知道，对于一个比我更老练的人来说，是否有什么明显的事情是我错过了。

编辑：我知道如果我正在导入firebase，那么我需要导入firebase/compat/**，但如果你看看错误，这似乎就是@angular/fire试图导入这些模块的方式，我不知道如何强制它导入兼容模块。

提前谢谢。

Answer 1

这是不兼容问题，因为您使用的是angular 13，它可以与firebase版本9.x.x紧凑，所以请将firebase升级到版本9.x.x

对于NPM

npm i firebase@9.6.3

或用于纱线

yarn add firebase@9.6.3

您也可以参考文档https://firebase.google.com/docs/web/modular-upgrade

谢谢&问候