Can not login with firebase in react redux, console says: firebase.auth is not a function

Question

In my react-redux application I want to login through firebase. I tried with the code showed below, but this error appears "firebase.auth is not a function"

import React, {useRef} from 'react';
import { getFirebase } from 'react-redux-firebase';
const Auth = () => {

    const emailRef = useRef('')
    const passwordRef = useRef('')


    const handleSubmit = e => {
        e.preventDefault()
        const firebase = getFirebase();
        firebase.login({
            email : emailRef.current.value,
            password : passwordRef.current.value
        }).then(res => console.log('se autentifico correctamente')).catch(error => console.log(error))
        
    }

I tried this one and shows me exactly the same error

import React, {useRef} from 'react';
import { getFirebase } from 'react-redux-firebase';


const Auth = () => {

    const emailRef = useRef('')
    const passwordRef = useRef('')


    const handleSubmit = e => {
        e.preventDefault()
        const firebase = getFirebase();
        firebase.auth().createUserWithEmailAndPassword(emailRef.current.value, passwordRef.current.value)
        .catch(error => console.log(error))
        
    }

Im just learning to use firebase and firestore, Im blocked in this point, I dont know how to login whit firebase

I tried using 'firebaseConnect' but is now deprecated

Answer 1

Welcome on Stack!

The error is related with using firebase.auth although its not imported. So for sure you have to import more than just react stuff. There are lot of examples in the internet if you just google it.

I have found this simple-example. It seems very nice to learn.

Usually there is a need to import at least firebase/app and firebase/auth to initialize app and authorization.

I hope it will help!

Answer 2

I ran into this same problem. You need to change the imports to the v9 compatibility versions, i.e:

import firebase from 'firebase/compat/app'
import 'firebase/compat/auth'
import 'firebase/compat/database'
import 'firebase/compat/firestore'