"ERROR FirebaseError: Firebase: No Firebase App '[DEFAULT]' has been created - call initializeApp() first (app/no-app)." I got this message after upgrading from angular/fire version 18.0.1 to 19.0.0

[praticboutic]

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",

[google-oss-bot]

This issue does not seem to follow the issue template. Make sure you provide all the required information.

[AlonsoK28]

Same for me.

My reproduction repo: https://stackblitz.com/github/AlonsoK28/failed-to-resolve-module-specifier-repo-issue

What does the error mean? And how we can fix it?

[AlonsoK28]

Hi @jamesdaniels could you give us some advice about this error ?