React firebase api - .a.auth is not a function

Question

I did a research but found that problem only in node.js context, or react context but from a long time ago, and guys say that upgrading their firebase helped. Mine was installed just last month.

Basically I'm using React with firebase api, and I this code:

firebase.auth().signInWithEmailAndPassword('an email', 'a password);

Throws the following error: TypeError: WEBPACK_IMPORTED_MODULE_2__firebase.a.auth is not a function

Of course I'm importing firebase:

import firebase from '../../firebase';

All the other firebase commands work just fine.

Has anyone had an experience with that problem using react.js ?

Thanks a lot in advance

Double check whether the path is correct. Also what are you exporting from that file? Share Firebase file code for better assistance — Hemadri Dasari
– Hemadri Dasari, Commented Nov 10, 2018 at 4:34
Hey mate thanks I was stupid not to use import "firebase/auth" in the firebase file. Thanks a lot you really helped me — sir-haver
– sir-haver, Commented Nov 10, 2018 at 23:37

sir-haver · Accepted Answer · 2018-11-10 23:40:34Z

1

Just posting the answer, maybe to help others. The simple solution (thanks to think-twice) is to import "firebase/auth". Here is an example of the Firebase file:

import firebase from 'firebase/app';
import 'firebase/storage';
import "firebase/database";
import "firebase/auth"


 // Initialize Firebase
 var config = {
    apiKey: "*********************",
    authDomain: "...",
    databaseURL: "...",
    projectId: "....",
    storageBucket: "....",
    messagingSenderId: "..."
  };
  firebase.initializeApp(config);

  const storage = firebase.storage();

  export {
      storage, firebase as default
  }

answered Nov 10, 2018 at 23:40

sir-haver

3,69210 gold badges60 silver badges115 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Tibere Prs · Accepted Answer · 2018-11-10 17:30:05Z

0

First check your path is correct, if is, try to delete the node_modules folder and make npm install again !

answered Nov 10, 2018 at 17:30

Tibere Prs

12 bronze badges

Comments

Revan99 · Accepted Answer · 2023-03-06 11:26:53Z

in the newer version of firebase you have functions to get firestore, storage or realtime database

import { initializeApp } from "firebase/app";
import { getFirestore } from "firebase/firestore";
import { getAuth } from "firebase/auth";
// TODO: Add SDKs for Firebase products that you want to use
// https://firebase.google.com/docs/web/setup#available-libraries

// Your web app's Firebase configuration
// For Firebase JS SDK v7.20.0 and later, measurementId is optional
const firebaseConfig = {
  // your firebase configuration
};

// Initialize Firebase
const app = initializeApp(firebaseConfig);
export const firestore = getFirestore(app); //use this for firestore
export const storage = getStorage(app); // use this for storage 
export const auth = getAuth(app);
export default app;

Collectives™ on Stack Overflow

React firebase api - .a.auth is not a function

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related