Question

我正在尝试使用AngularFire进行身份验证。在ng serve期间，任何实例化身份验证提供程序（例如firebase.auth.GoogleAuthProvider）的尝试都将导致崩溃。我正在做与AngularFireAuth quickstart example完全相同的事情。我想念什么吗？

我的应用程序很小：

// app.component.ts

import { Component } from "@angular/core";
import { AngularFireAuth } from '@angular/fire/auth';
import { auth } from 'firebase/app';

@Component({...})
export class AppComponent {
  constructor(private afAuth: AngularFireAuth) { }

  ngOnInit() {
    this.afAuth.signInWithRedirect(new auth.GoogleAuthProvider());
  }
}

// app.module.ts

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

@NgModule({
  declarations: [AppComponent],
  imports: [
    AngularFireModule.initializeApp(environment.firebase),
    AngularFireAuthModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

// package.json
  "dependencies": {
    "@angular/core": "~9.1.4",
    "@angular/fire": "^6.0.0-rc.2",
    "firebase": "7.14.3",
    ...
  },

我发现this question存在类似的问题，但是他们没有使用AngularFire，而只是使用普通的Firebase。使用AngularFire，我认为我不应该在index.html中手动包含Firebase脚本。

Answer 1

我找到了真正的解决方案。在应用模块中导入AngularFire模块时，必须将"angular-auth-firebase"传递给initializeApp()：

@NgModule({
  declarations: [ ... ],
  imports: [
    AngularFireModule.initializeApp(environment.firebase, "angular-auth-firebase"),
    AngularFireAuthModule,
    ...
  ],
  ...
})
export class AppModule { }

旧答案（解决方法）：

我找到了一种解决方法here。如果我只是将import "firebase/auth";添加到app.module.ts中，则一切正常，尽管我不确定这是否是永久性的解决方法。

AngularFireAuth：无法读取未定义的属性“ GoogleAuthProvider”

1 个答案:

旧答案（解决方法）：