FirebaseUI 与 create-react-app

Question

我正在尝试在使用 create-react-app 制作的 react 应用中使用 firebaseUI 库进行身份验证。它在标准的 html/js 应用程序中运行良好，但我无法让它与 react 一起使用。

这是我的简单登录组件：

import React, { Component } from 'react'
import * as firebase from 'firebase'
import firebaseui from 'firebaseui'

const dbConfig = {
  apiKey: ...,
  authDomain: ...,
  ...
}
firebase.initializeApp(dbConfig)

const uiConfig = {
  signInFlow: 'popup',
  signInOptions: [
    firebase.auth.GoogleAuthProvider.PROVIDER_ID,
    firebase.auth.EmailAuthProvider.PROVIDER_ID
  ]
}

class Login extends Component {

  componentDidMount() {
    console.log("component mounted")
    var ui = new firebaseui.auth.AuthUI(firebase.auth())
    ui.start('#firebaseui-auth-container', uiConfig)
  }

  render() {
    return (
      <div id="firebaseui-auth-container"></div>
    )
  }
}

export default Login

在我尝试使用 new firebaseui.auth.AuthUI(firebase.auth()) 初始化 firebaseUI 小部件之前，所有 firebase 的东西都可以工作，这时它会抛出一个错误，说 firebase.initializeApp is not a function。问题似乎源于调用 initializeApp 的node_modules/firebaseui/dist/npm.js:340。

其他人经历过这种行为（并希望解决它）？

顺便说一句，这是我的 firebase 依赖项：

"firebase": "^5.0.2",
"firebaseui": "^3.0.0"

Answer 1

这是新版本的firebase（5.0.2）的问题。切换到版本 4.13.0 解决了这个问题。