Disclaimer: I have reviewed these posts and they dont seem to answer my question: AngularFireModule and AngularFireDatabaseModule not being found in @angular/fire
No exported member error with firebase when trying to compile angular 10 project
ERROR in node_modules/@angular/fire/firebase.app.module.d.ts?
My current angular dependencies from my package.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"
},
Imports and declarations:
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 { }
Based on the above posts, this combination of @angular/fire and firebase should work. I have the 7.0.0+ which means I neat the compat portion of the @angular/fire modules, and I have firebase 8.X.X which I believe is the correct level of firebase to work with fire 7.
Still I'm getting a list of the following errors:
./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)
Is there anything about firebase I'm not understanding or a version I should downgrade to in order to get this app to compile?
Sorry if the answer is in one of the links posted and I just dont understand it. I am trying to avoid downgrading both modules to lower versions if I can avoid it, but if that's the only answer then that's the only answer. I just want to know if there's anything obvious to someone more practiced than I am that I'm missing.
EDIT: I understand that if I was importing firebase then I would need to import firebase/compat/**, but if you look at the errors, this seems to be how @angular/fire is attempting to import these modules and I dont know how to force it to import the compatibility module.
Thanks in advance.
