Description
Got blank page on landing page and the error on any browsers when running ng serve :
main.ts:12 ERROR FirebaseError: Firebase: No Firebase App '[DEFAULT]' has been created - call initializeApp() first (app/no-app).
at getApp (index.esm2017.js:628:25)
at getMessagingInWindow (index.esm2017.js:1152:37)
at angular-fire.mjs:174:44
at angular-fire.mjs:127:41
at _ZoneDelegate.invoke (zone.js:369:28)
at ZoneImpl.run (zone.js:111:43)
at _NgZone.runOutsideAngular (core.mjs:6421:24)
at runOutsideAngular (angular-fire.mjs:127:17)
at angular-fire.mjs:174:17
at firebase.module.ts:18:28
main.ts:13 FirebaseError: Firebase: No Firebase App '[DEFAULT]' has been created - call initializeApp() first (app/no-app).
at getApp (index.esm2017.js:628:25)
at getMessagingInWindow (index.esm2017.js:1152:37)
at angular-fire.mjs:174:44
at angular-fire.mjs:127:41
at _ZoneDelegate.invoke (zone.js:369:28)
at ZoneImpl.run (zone.js:111:43)
at _NgZone.runOutsideAngular (core.mjs:6421:24)
at runOutsideAngular (angular-fire.mjs:127:17)
at angular-fire.mjs:174:17
at firebase.module.ts:18:28
(anonyme) @ main.ts:13
invoke @ zone.js:369
run @ zone.js:111
(anonyme) @ zone.js:2538
invokeTask @ zone.js:402
runTask @ zone.js:159
drainMicroTaskQueue @ zone.js:581
Promise.then
nativeScheduleMicroTask @ zone.js:557
scheduleMicroTask @ zone.js:568
scheduleTask @ zone.js:391
scheduleTask @ zone.js:205
scheduleMicroTask @ zone.js:225
scheduleResolveOrReject @ zone.js:2528
then @ zone.js:2733
bootstrapModule @ core.mjs:35456
(anonyme) @ main.ts:12
It appears when upgarding from @angular/fire version 18.0.1 to version 19.0.0
Additionnal info :
firebase.module.ts
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { provideFirestore, getFirestore } from '@angular/fire/firestore';
import { getMessaging, provideMessaging } from '@angular/fire/messaging';
import { provideFirebaseApp, initializeApp } from '@angular/fire/app';
import { getAuth, provideAuth } from '@angular/fire/auth';
import { environment } from './../../environments/environment';
@NgModule({
imports: [
CommonModule,
],
providers: [
provideFirebaseApp(() => initializeApp(environment.firebase)),
provideFirestore(() => getFirestore()),
provideAuth(() => getAuth()),
provideMessaging(() => getMessaging()), // 👈👈👈 importing messaging module
]
})
export class FirebaseModule { }
thrown by main.ts
/// <reference types="@angular/localize" />
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app/app.module';
import { environment } from './environments/environment';
if (environment.production) {
window.console.log = () => { }
}
platformBrowserDynamic().bootstrapModule(AppModule)
.catch(err => console.error(err));
package.json
"dependencies": {
...
"@angular/fire": "^19.0.0",