Property 'auth' does not exist on type 'AngularFireAuth'

Question

Getting this error when using angularfire. Have checked my imports and they seem to be correct. I have tried to reinstall angularfire however it is still throwing this error. Is there issues with angularfire?

import { Injectable, NgZone } from '@angular/core';
import { User } from "../services/user";
import { auth } from 'firebase/app';
import { AngularFireAuth } from "@angular/fire/auth";
import { AngularFirestore, AngularFirestoreDocument } from '@angular/fire/firestore';
import { Router } from "@angular/router";


@Injectable({
  providedIn: 'root'
})

export class AuthService {
  userData: any; // Save logged in user data

  constructor(
    public afs: AngularFirestore,   // Inject Firestore service
    public afAuth: AngularFireAuth, // Inject Firebase auth service
    public router: Router,  
    public ngZone: NgZone // NgZone service to remove outside scope warning
  ) {    
    /* Saving user data in localstorage when 
    logged in and setting up null when logged out */
    this.afAuth.authState.subscribe(user => {
      if (user) {
        this.userData = user;
        localStorage.setItem('user', JSON.stringify(this.userData));
        JSON.parse(localStorage.getItem('user'));
      } else {
        localStorage.setItem('user', null);
        JSON.parse(localStorage.getItem('user'));
      }
    })
  }

  // Sign in with email/password
  SignIn(email, password) {
    return this.afAuth.auth.signInWithEmailAndPassword(email, password)
      .then((result) => {
        this.ngZone.run(() => {
          this.router.navigate(['dashboard']);
        });
        this.SetUserData(result.user);
      }).catch((error) => {
        window.alert(error.message)
      })
  }

in case anyone else has my issue, you used to be able to reference firebase.auth().onAuthStateChanged(...) directly, so make sure you now add AngularFireAuth to the constructor and reference this.afAuth.onAuthStateChanged(...) — Ryan Loggerythm, Mar 12 '21 at 15:55

score 55 · Answer 1 · answered May 01 '20 at 16:06

55

Had the same problem. Seems starting "@angular/fire": "^6.0.0" AngularFireAuth has dropped the auth property.

Just delete auth & it should work

https://github.com/angular/angularfire/issues/2409#issuecomment-615993136

answered May 01 '20 at 16:06

Anish K Pillai

796
6
10

Most places yes. Not with firebaseui as in this.ui = new firebaseui.auth.AuthUI(this.afAuth); will not work – mozpider Jun 17 '20 at 04:00
Does not work for Angular9. Removing auth gives a new error "signInWithEmailAndPassword does not exist on type AngularFireAuth" – Brando Aug 02 '20 at 17:45

score 9 · Answer 2 · answered Jan 31 '21 at 16:36

9

Just delete the "auth", and it will work

Property 'auth' does not exist on type 'AngularFireAuth' #2409

answered Jan 31 '21 at 16:36

Muhammed Moussa

4,589
33
27

1

Worked for me, Thank you! – Hemanth Peela Apr 16 '21 at 19:36

score 5 · Answer 3 · answered Apr 05 '20 at 07:36

I had the same problem and it was related to version mismatch in package.json. I had

dependencies {
        ...
        "@angular/fire": "latest", // It was 6.0.0
        "firebase": "5.4.2",
        ...
}

Then I changed to

dependencies {
        ...
        "@angular/fire": "5.4.2",
        "firebase": "5.4.2",
        ...
}

Also ensure to import AngularFireAuthModule in your app.module.ts

import { AngularFireAuthModule } from '@angular/fire/auth';

...
@NgModule({
    imports: [
        AngularFireAuthModule
    ],
    ....
})
export class AppModule { }

score 4 · Answer 4 · edited Nov 01 '20 at 12:20

4

You should import the right Firebase:

import firebase from 'firebase/app';

and then for example:

// Sign in with Google
GoogleAuth(): any {
    return this.AuthLogin(new firebase.auth.GoogleAuthProvider());
}

edited Nov 01 '20 at 12:20

Elletlar

3,136
7
32
38

answered Nov 01 '20 at 11:32

Ghislain Zabatio

153
7

score 2 · Answer 5 · answered Apr 21 '20 at 01:36

2

hello noce if it's the truth but this worked for me

1 - npm uninstall firebase @angular/fire

2- package.json

3 - dependencies { ... "@angular/fire": "6.0.0", "firebase": "7.14.1", ... }

4 - change

dependencies { ... "@angular/fire": "^5.4.2",

...

5 - save

6 - npm install firebase @angular/fire

if you find another much better solution but for now this worked

answered Apr 21 '20 at 01:36

edgartank

21
1

Not sure if it will solve the issue, seems like typed definition is missing because of which type error is coming up. – Manish Kumar Apr 21 '20 at 10:36

score 1 · Answer 6 · answered Nov 28 '20 at 06:49

This one happens because of the new update. Check the release note! changelog.

@angular/fire/auth AngularFireAuth has dropped the auth property and instead Promise Proxies the underlying Firebase auth.Auth instance

Just delete the "auth", and it will work

score 1 · Answer 7 · answered Feb 14 '21 at 14:21

Below solution worked for me:

1. Import firebase

import firebase from "firebase/app";
import "firebase/auth";

2. then in the constructor use firebase like this:

  this.auth = firebase.auth;

3. then use function like below:

this.auth.signInWithEmailAndPassword(email, password)
.then((result) => {
  this.ngZone.run(() => {
    this.router.navigate(['dashboard']);
  });
  this.SetUserData(result.user);
}).catch((error) => {
  window.alert(error.message)
})

score 0 · Answer 8 · answered Aug 07 '20 at 13:11

After checking different combinations, the latest version of @angular/fire that works with Angular 9.1.6 is 5.4.2.

Any version above would not allow you to use the auth AngularFireAuth property, even though I could not find any explicit deprecation notice in the docs.

score 0 · Answer 9 · answered Oct 12 '20 at 14:09

https://github.com/angular/angularfire/blob/master/docs/version-6-upgrade.md

"AngularFireAuth has dropped the auth property and instead Promise Proxies the underlying Firebase auth.Auth instance; allowing your development experience to more closely mirror the JS SDK. Similar changes have been made to AngularFireFunctions, AngularFireMessaging, and AngularFirePerformance."

Property 'auth' does not exist on type 'AngularFireAuth'

9 Answers9

Linked