ERROR TypeError: Cannot read property 'GoogleAuthProvider' of undefined
susovan87 opened this issue · comments
Version info
Angular: 5.2.10
Firebase: 4.13.0
AngularFire: 5.0.0-rc.6.0
Other (e.g. Node, browser, operating system) (if applicable):
@firebase/app: 0.1.10
Node: v8.11.1
Browser: Google Chrome Version 65.0.3325.181 (Official Build) (64-bit)
Test case
Firebase Authentication is not working. I have tried the same code as mentioned in 5. Getting started with Firebase Authentication. Got error message as below
ERROR TypeError: Cannot read property 'GoogleAuthProvider' of undefined
at AppComponent.login (app.component.ts:46)
at Object.eval [as handleEvent] (AppComponent.html:13)
at handleEvent (core.js:13589)
at callWithDebugContext (core.js:15098)
at Object.debugHandleEvent [as handleEvent] (core.js:14685)
at dispatchEvent (core.js:10004)
at eval (core.js:10629)
at HTMLButtonElement.eval (platform-browser.js:2628)
at ZoneDelegate.invokeTask (zone.js:421)
at Object.onInvokeTask (core.js:4751)
Error in below line
this.afAuth.auth.signInWithPopup(new firebase.auth.GoogleAuthProvider());
Inspecting firebase
shows no auth
inside
Please note that I have already enabled Google Authentication
from firebase console
.
Tried replacing import * as firebase from 'firebase/app';
→import * as firebase from 'firebase';
as suggested by this post https://stackoverflow.com/a/48865752/2231209
But no luck.
Asked for help in Stackoverflow too https://stackoverflow.com/a/50025372/2231209
I upgraded angularfire2 in my app to "5.0.0-rc.6.0" today and have exactly the same problem as @susovan87
version info:
"angularfire2": "^5.0.0-rc.6.0",
"@firebase/app": "^0.1.6",
"firebase": "^4.13.1",
"angular/core": "^5.2.10"
For the moment if you change the version of firebase to 4.12.1 work it.
I had the same problem!
Just change this:
import * as firebase from 'firebase';
in favor of
import { firebase } from '@firebase/app';
That works for me.
My dependencies:
"dependencies": {
"@angular/animations": "5.2.10",
"@angular/common": "5.2.10",
"@angular/compiler": "5.2.10",
"@angular/core": "5.2.10",
"@angular/forms": "5.2.10",
"@angular/http": "5.2.10",
"@angular/platform-browser": "5.2.10",
"@angular/platform-browser-dynamic": "5.2.10",
"@angular/router": "5.2.10",
"@firebase/app": "0.1.6",
"angularfire2": "5.0.0-rc.6.0",
"core-js": "2.4.1",
"firebase": "4.13.1",
"font-awesome": "4.7.0",
"rxjs": "^5.5.10",
"zone.js": "^0.8.26"
}
Hope it helps!
Thanks @SMontiel, import { firebase } from '@firebase/app';
solved the issue.
Thank you. @SMontiel
Works for me to.
Issue is till open so I want to contribute my solution:
"firebase": "^5.3.0"
import firebase from 'firebase/app';
import 'firebase/auth';
export const googleProvider = new firebase.auth.GoogleAuthProvider();
Cant seem to get this to work either. Tried downgrading but that messed up a few of my call functions. Using latest version of everything...
Hola, tenia el mismo error y la manera en que lo solucione, fue simplemente agregando en el index la siguiente linea:
<script src="https://www.gstatic.com/firebasejs/5.10.1/firebase-auth.js"></script>Buenas! Como dice Jonathan tambien lo solucione con agregar al html:
<script src="https://www.gstatic.com/firebasejs/5.10.1/firebase-auth.js"></script>Had to go with this for Angular/Fire 6.0.0
import { auth } from 'firebase/app'; import 'firebase/auth';
@danfri86 Thanks man, that approach worked for me !
"@angular/fire": "^6.0.0",
"firebase": "^7.13.2",
I think @gustavo-alarcon's solution should be included in the installation instructions and readme. Developers shouldn't have to search and come here in the issues to find this out when it can be done. I am willing to update the readme if need be.
For the record and anyone else ending up here, this worked for me:
import { AngularFireAuth } from '@angular/fire/auth';
import firebase from 'firebase/app';
import 'firebase/auth'
Then I could use this, as a crude example
constructor(
private angularFireAuth: AngularFireAuth,
) {
this.angularFireAuth.signInWithPopup(new firebase.auth.GoogleAuthProvider());
}
I am using:
"@angular/fire": "^6.0.4"
"firebase": "^8.0.1"
For the record and anyone else ending up here, this worked for me:
import { AngularFireAuth } from '@angular/fire/auth'; import firebase from 'firebase/app'; import 'firebase/auth'
Then I could use this, as a crude example
constructor( private angularFireAuth: AngularFireAuth, ) { this.angularFireAuth.signInWithPopup(new firebase.auth.GoogleAuthProvider()); }
I am using:
"@angular/fire": "^6.0.4" "firebase": "^8.0.1"
works on
"@angular/fire": "^6.1.2",
"firebase": "^8.1.1",