Firebase: No Firebase App '[DEFAULT]' has been created when using Reserved Hosting URL

user_1511877 0
Viewed 431

I've setup my firebase web project by following the guide here

I decided to use the reserved hosting URL as it seemed like a great solution for handling a local, staging, and production enviornment of my project as described here

The issue is, when trying to use firebase in one of my components:

firebase.auth()

I get the following error

No Firebase App '[DEFAULT]' has been created- call Firebase App.initializeApp()

index.html file

<body>
    <noscript>You need to enable JavaScript to run this app.</noscript>
    <div id="root"></div>
    <!-- The core Firebase JS SDK is always required and must be listed first -->
    <script src="https://www.gstatic.com/firebasejs/7.9.3/firebase-app.js"></script>
    <script src="https://www.gstatic.com/firebasejs/7.9.3/firebase-auth.js"></script>
    <script src="https://www.gstatic.com/firebasejs/7.9.3/firebase-analytics.js"></script>
    <script src="/__/firebase/init.js"></script>
  </body>

test.jsx file

import firebase from "firebase";

class LoginModal extends React.Component {

sendVerificationCode() {
    var phoneNumber = this.userPhoneNumber;
    console.log("sending verification code to: ", phoneNumber);
    var appVerifier = window.recaptchaVerifier;

    firebase
      .auth()
      .signInWithPhoneNumber(phoneNumber, appVerifier)
      .then(function(confirmationResult) {
        // SMS sent. Prompt user to type the code from the message, then sign the
        // user in with confirmationResult.confirm(code).
        window.confirmationResult = confirmationResult;
        console.log("confirmationResult = ", confirmationResult);
      })
      .catch(function(error) {
        // Error; SMS not sent
        console.log("error = ", error);
        // ...
      });
  }

}

When calling that function (sendVerificationCode()), the app crashes with the following error:

FirebaseError: Firebase: No Firebase App '[DEFAULT]' has been created - call Firebase App.initializeApp() (app/no-app).

Additionally, I am getting this output in console (could be related, but not sure...):

init.js:1 Uncaught SyntaxError: Unexpected token '<'

Any deas on what I might be missing? Thanks!!

firebase-authentication firebase reactjs web javascript
2 Answers

If you try

window.firebase

you will actually see the instance of firebase has been initialized.

user_50940970

The reserved hosting URLs are only served locally if you serve your site with Firebase CLI:

firebase serve

your site should be visible @ http://localhost:5000

One alternative solution is to determine if the project has loaded, and load a testing environment if not:

if (! firebase.apps.length) {
    firebase.initializeApp({
        // firebase config object
    })
}
user_15727670
Related