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

2
votes

I'm building a React Native app, currently trying to implement an authentication registration system through Firebase Auth. I've followed a guide/the docs on the website to setup the Firebase config file. I run the app, enter a email and password, when I click the signup button I'm given the follow error below:

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

I've search on google for possible fixes yet nothing seems to work. I've initialized Firebase as per the docs/tutorials I've watched. Hopefully someone can shed some light on the matter. I'll include the config file code below, XXXX to replace my actual config info

firebase.js

import * as firebase from 'firebase/app';
import "firebase/auth";

const firebaseConfig = {
  apiKey: "XXXX",
  authDomain: "XXXX",
  databaseURL: "XXXX",
  projectId: "XXXX",
  storageBucket: "XXXX",
  messagingSenderId: "XXXX",
  appId: "XXXX",
  measurementId: "XXXX"
};

firebase.initializeApp(firebaseConfig);

api.js

export function registerUser({email, password}) {
  firebase
    .auth()
    .createUserWithEmailAndPassword(email, password)
    .catch(function(error) {
      console.log(error);
    });
};

EDIT/ANSWER

As helped in the comments below, the correct way was to implement/import through React-Native-Firebase. Links are in the comments.

4
androidfirebasereact-nativefirebase-realtime-databasefirebase-authentication
you are using react-native-firebase package? by invertase? - Rizwan Atta
if you are using react-native-firebase you are not in need to use the config ! you will have to put the json file,plist file in native part of the project! and for Auth you have to install the firebase/auth too! - Rizwan Atta
The guide I went off just used firebase as shown in the code above. It used the web setup through Firebase console instead of Android/iOS - afx31
import * as firebase from 'firebase/app'; import "firebase/auth"; it will not work if you used FIrebase (JS package from npm) . if you want the firebase to work better on RN apps go with React-native-firebase - Rizwan Atta
Ah okay. So just 'npm i react-native-firebase' and thats it? Or do I have to do the configuration as well in the android build.gradle files as well? - afx31

4 Answers

3
votes

Seemingly you are using the syntax of Invertase Firebase project while on the back you are using the WEB SDK of firebase from a firebase npm package.

here is what you should do:

go and install react-native-firebase from here

make sure the pods work and auto-linking works, you have included the json and plist file.! only following these your projects will build and you can use the syntax you have posted in your question!

0
votes

You Write Your configuration Like Follow:

componetWillMount() {
const config = {
apiKey: “xxxxxxxxxxxxxxxxxxxxxxxx”,
authDomain: “auth-bdcdc.firebaseapp.com 20”,
databaseURL: “https://auth-bdcdc.firebaseio.com 7”,
projectId: “auth-bdcdc”,
storageBucket: “auth-bdcdc.appspot.com 2”,
messagingSenderId: “xxxxxxxxxx”
};
firebase.initializeApp(firebaseConfig);
}
0
votes

Check if GoogleService-Info.plist is missing in the ios folder.

0
votes

This is what I did to solve it.

Use Async function for the registrations

FirebaseConfig.js

import firebase from 'firebase/app';


const firebaseConfig = {
  apiKey: "XXXX",
  authDomain: "XXXX",
  databaseURL: "XXXX",
  projectId: "XXXX",
  storageBucket: "XXXX",
  messagingSenderId: "XXXX",
  appId: "XXXX",
  measurementId: "XXXX"
};

firebase.initializeApp(firebaseConfig); // It's expecting an objects

Registration as async function:

Registration.js

export async function Registration(email, password, lastName, firstName) {
  try {
    await firebase.auth().createUserWithEmailAndPassword(email, password);
    const currentUser = firebase.auth().currentUser;
    const db = firebase.firestore();
    db.collection("users").doc(currentUser.uid).set({
      email: currentUser.email,
      lastName: lastName,
      firstName: firstName,
    });
  } catch (err) {
    Alert.alert("There is something wrong!!!!", err.message);
  }
}

If those works don't forget to upvote.