firestore vue.js: auth() is not a function

Question

I have a firebase config file like this:

import { firebase } from "@firebase/app";
import "@firebase/firestore";

const firebaseApp = firebase.initializeApp({
    apiKey: "myKey",
    authDomain: "myDomain",
    databaseURL: "myURL",
    projectId: "myProject",
    storageBucket: "myBucket",
    messagingSenderId: "999999999"
});

export const db = firebaseApp.firestore();
export const firebaseApp = firebaseApp;

I am trying to authenticate a user but keep getting firebaseApp.auth() is not a function.

let me = db.collection('staff').where('email', '==', this.current_user.email)
    .get()
    .then((querySnapshot) => {
        querySnapshot.forEach((doc) => {
           this.fbUser = doc.id;
           let email = doc.data().email;
           let pw = doc.data().key;

           firebaseApp.auth().onAuthStateChanged(user => {
              if (user) {
                 //console.log('Already authenticated.');
              } else {
                 firebaseApp.auth().signInWithEmailAndPassword(email, pw)
                    .then(liu => {
                        //console.log('Logged in', liu.uid);
                        let uid = liu.uid;
                        this.$localStorage.set('fbId',this.fbUser, 0);
                        this.$localStorage.set('fbAuthId', uid, 0);
                        me.update({
                           is_active: true
                        });
                  });
              } // end if
          });
      });

Don't I have to configure the app? There's no auth functionality in @firebase.

Any help is appreciated.

I believe auth() is a method of your firebase module rather than your app instance. Have you tried accessing it via firebase.auth()? — Benjamin Scholtz
– Benjamin Scholtz, Commented Jul 29, 2018 at 18:50

Renaud Tarnec · Accepted Answer · 2018-07-29 19:16:55Z

5

You should add the auth Firebase service in your initialization, as follows:

import { firebase } from "@firebase/app";
import "@firebase/firestore";
import "@firebase/auth";  // <- NEW

const firebaseApp = firebase.initializeApp({
    apiKey: "myKey",
    authDomain: "myDomain",
    databaseURL: "myURL",
    projectId: "myProject",
    storageBucket: "myBucket",
    messagingSenderId: "999999999"
});

export const db = firebaseApp.firestore();
export const auth = firebaseApp.auth();  // <- NEW
export const firebaseApp = firebaseApp;

Then, in your component, you do:

auth.onAuthStateChanged(user => {})

and

auth.signInWithEmailAndPassword(email, pw)

answered Jul 29, 2018 at 19:16

Renaud Tarnec

83.4k10 gold badges99 silver badges130 bronze badges

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

Collectives™ on Stack Overflow

firestore vue.js: auth() is not a function

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related