Angular 18中@angular/fire初始化失败，提示无DEFAULT Firebase应用

核心原因：直接调用Firebase原生API，未使用Angular Fire的注入式服务 #

你在ngOnInit里直接调用getMessaging()、getToken()这些Firebase原生方法，但@angular/fire是通过依赖注入（DI）来管理Firebase服务实例的，原生方法无法感知Angular Fire在app.config中配置的初始化流程，所以会报错找不到DEFAULT App。

具体解决步骤 #

1. 改用Angular Fire的Messaging注入服务
   在app.component.ts中，通过构造函数注入Messaging服务，而非直接调用原生API：

   import { Messaging } from '@angular/fire/messaging';
   import { environment } from '../environments/environment';
   
   export class AppComponent {
     constructor(private messaging: Messaging) {}
   
     async ngOnInit() {
       try {
         // 使用注入的messaging实例调用方法
         const token = await this.messaging.getToken({
           vapidKey: environment.firebaseVapidKey // 需在环境变量中配置VAPID密钥
         });
         console.log('FCM Token:', token);
       } catch (error) {
         console.error('获取Token失败:', error);
       }
     }
   }
   

2. 检查app.config.ts中的Firebase配置完整性
   确保provideMessaging的配置正确，必须传入获取Messaging实例的工厂函数：

   import { provideFirebaseApp, initializeApp } from '@angular/fire/app';
   import { provideMessaging, getMessaging } from '@angular/fire/messaging';
   import { environment } from './environments/environment';
   
   export const appConfig: ApplicationConfig = {
     providers: [
       provideFirebaseApp(() => initializeApp(environment.firebaseConfig)),
       // 必须传入getMessaging工厂函数，否则无法正确注册服务
       provideMessaging(() => getMessaging())
     ]
   };
   

3. 验证环境变量配置
   确认environment.firebaseConfig里的apiKey、authDomain等参数完全正确，无拼写错误或遗漏项。

额外注意点 #

• Angular 18+为独立组件模式，所有Firebase服务必须通过app.config的providers注册，不要在模块中重复配置。
• 如果使用动态初始化（比如延迟加载环境配置），需确保Firebase App初始化完成后再调用Messaging相关方法，可通过FirebaseApp服务的状态监听处理。

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