Getting Firebase: No Firebase App '[DEFAULT]' has been created error

Viewed 336

Ok so I think I know why this error is happening, because firebase hasn't been initialized but I'm trying to access it, but I don't understand why because I believe I initialize it in my index.html. Thinking its an order of operations /async thing?

Anyways I am deploying to Firebase Hosting, so according to their website

Initialize Firebase in your app (no need to include your Firebase config object when using reserved Hosting URLs): 

I should be able to put <script src="/__/firebase/init.js"></script> below my SDK loading to initialize firebase. What I don't understand is if this actually initializes a firebase app the same way that the line firebase.initializeApp() does? Basically I think my issue is either that script does indeed initialize a firebase app for me, and I am just trying to access it in my react function before its done, or I need to run firebase.initializeApp() separately.

Trying to implement FirebaseUi for auth on react as correctly as possible.

1 Answers

React.useEffect(), per its name is a side effect, which does not guarantee it'll run prior to it's render.

See https://codesandbox.io/s/holy-water-ni9ut?file=/src/App.js as an example - render, render, then effect. In fact, it doesn't even get called prior to rendering.

Some notes:

  • firebase.initializeApp should be called prior to ReactDOM.render() being called (as per comments)
  • useEffect must have dependencies, otherwise, it will run on every render. (the firebase.auth().onStateChanged(user => setIsSignedIn(user) effect should be called with [] as the 2nd parameter`)
Related