Angular13/14集成@angular/fire7.4 Auth报NullInjectorError错误

报错本质是**@angular/fire 新旧API混用，导致兼容层依赖未注册**：
你在app.module.ts中注册的是v7版本后推出的支持摇树优化的新模块化API：provideFirebaseApp、provideAuth，这套Provider仅服务于@angular/fire/*非compat路径下的新API；但组件中注入的AngularFireAuth来自@angular/fire/compat/auth旧兼容层路径，该服务依赖angularfire2.app.options注入令牌，你没有为compat层注册对应配置，因此触发找不到Provider的错误。

两种方案二选一即可，禁止新旧API混合使用，否则不仅会出现注入错误，还会导致Firebase包被重复打包，增大产物体积。

方案1：全量使用新模块化API（推荐） #

新API支持摇树优化，打包体积更小，无需引入兼容层，直接改造组件即可：

1. 保留现有app.module.ts中provideFirebaseApp、provideAuth的配置无需改动
2. 将组件中compat路径的导入和服务调用替换为新API，修改后的fire-auth.component.ts代码如下：

import { Component, OnInit, inject } from '@angular/core';
import { Auth, authState, GoogleAuthProvider, signInWithPopup, signOut } from '@angular/fire/auth';
import { AsyncPipe, NgIf } from '@angular/common';

@Component({
  selector: 'app-fire-auth',
  // 非standalone模式请删除下一行，将NgIf、AsyncPipe加入所属NgModule的imports数组
  standalone: true,
  imports: [NgIf, AsyncPipe],
  template: `
  <div *ngIf="user$ | async as user; else showLogin">
    <h1>Hello {{ user.displayName }}!</h1>
    <button (click)="logout()">Logout</button>
  </div>
  <ng-template #showLogin>
    <p>Please login.</p>
    <button (click)="login()">Login with Google</button>
  </ng-template>
`,
})
export class FireAuthComponent implements OnInit {
  private auth: Auth = inject(Auth);
  user$ = authState(this.auth);

  ngOnInit(): void {}
  
  login() {
    signInWithPopup(this.auth, new GoogleAuthProvider());
  }
  logout() {
    signOut(this.auth);
  }
}

方案2：使用compat兼容层API（适合老项目过渡） #

如果暂时不想重构组件代码，需要继续使用AngularFireAuth兼容写法，将模块中的Provider替换为compat层对应注册逻辑即可：

1. 在app.module.ts中新增compat模块的导入：

import { AngularFireModule } from '@angular/fire/compat';
import { AngularFireAuthModule } from '@angular/fire/compat/auth';

2. 将imports数组中原有的provideFirebaseApp、provideAuth删除，替换为compat模块初始化配置：

imports: [
  BrowserModule,
  AngularFireModule.initializeApp(environment.firebase),
  AngularFireAuthModule
],

修改完成后原有组件的AngularFireAuth注入即可正常运行。

使用compat方案时请确认版本匹配：@angular/fire 7.4对应firebase 9.x大版本，不要跨大版本安装依赖，否则会出现额外的兼容性问题。

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