CODEWITHSUNDEEP
firebasereact-nativefirebase-authentication
John
John

Reputation: 3

Setting up firebase with react native

I am having difficulties setting up firebase with react native.

src/components/firebase.js

import firebase from '@firebase/app';
import '@firebase/auth';

const firebaseConfig  = {
    apiKey: "AIzaSyCJshsr47p3IriQGF0V4gaVd-bCuo_HN6A",
    authDomain: "auth-8f2ec.firebaseapp.com",
    databaseURL: "https://auth-8f2ec.firebaseio.com",
    projectId: "auth-8f2ec",
    storageBucket: "auth-8f2ec.appspot.com",
    messagingSenderId: "1013084520551"
  };


const Firebase = firebase.initializeApp(firebaseConfig);
export default Firebase;

src/components/LoginForm.js

First I import Firebase 

import Firebase from './firebase';

then authentication is done this way.

Firebase.auth().signInWithEmailAndPassword(email, password)
.then(this.onLoginSuccess.bind(this))
.catch(() => {
  Firebase.auth().createUserWithEmailAndPassword(email, password)
  .then(this.onLoginSuccess.bind(this))
  .catch(this.onLoginFail.bind(this));
});
};

src/App.js

Firebase is imported in this way 

import Firebase from './components/firebase';

The component will mount method runs this way. 

componentWillMount(){
    Firebase.auth().onAuthStateChanged((user) => {
      console.log(Firebase.auth());
      if(user){
        console.log('firebase login success');
        this.setState({ loggedIn: true});
      }
      else{
        console.log('firebase login failed');
        this.setState({ loggedIn: false });
      }
    });
  };

The result is a spinner. Something is wrong with the way firebase is being imported. Help would be appreciated. Thanks in advance.

Thanks in advance.

Upvotes: 0

Views: 86

Answers (1)

Douglas M. Barcellos
Douglas M. Barcellos

Reputation: 158

Strange you're importing with "@" at the beginning. Try to import this way:

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

Upvotes: 1

Related Questions