angular / angularfire

Angular + Firebase = ❤️
https://firebaseopensource.com/projects/angular/angularfire2
MIT License
7.66k stars 2.19k forks source link

Auth is not a function when using compatibility in production build #3221

Open briandiloreto opened 2 years ago

briandiloreto commented 2 years ago

Version info

Angular: 13.3.0

Firebase: ^9.8.1

AngularFire: 7.3.0

Other (e.g. Ionic/Cordova, Node, browser, operating system):

How to reproduce these conditions

Steps to set up and reproduce

When a production build is served, we have an error with Firebase app.auth() is not found. This does not happen with a development build.

We are using the compatibility version of Angular Fire.

Debug output

Errors in the JavaScript console

main.ts:16 TypeError: Bt.auth is not a function at angular-fire-compat-auth.js:59:51 at rr.invoke (zone.js:409:30) at rr.run (zone.js:169:47) at value (core.mjs:25486:28) at angular-fire-compat-auth.js:59:23 at tn (angular-fire-compat.js:147:29) at we (angular-fire-compat-auth.js:58:116) at new Ue (angular-fire-compat-firestore.js:513:13) at Object.$e.ɵfac [as factory] (angular-fire-compat-firestore.js:584:1) at value (core.mjs:11477:35)

Expected behavior

Build runs on both development and production

Actual behavior

Build runs only in development

AmitMY commented 2 years ago

This is only happening when using angular's optimization: true in production which performs minification and tree-shaking. Is the angular/fire compatability code tested under these conditions?

TomCockram commented 2 years ago

I'm also getting this issue. As @AmitMY mentioned setting optimization: false gets rid of this issue. However, this increased my bundle size from 600kb to 4.09MB.

https://stackoverflow.com/questions/72713590/ye-auth-is-not-a-function-angular-fire

Can we please get some eyes on this??

georgelviv commented 2 years ago

Same issue

avramz commented 2 years ago

Same issue

wkndmarkt commented 2 years ago

Same issue with AngularFire 7.4.1

weilinzung commented 2 years ago

same issue 7.4.1

mrnetforge commented 2 years ago

Same

spicemix commented 2 years ago

I'm getting this even if not in a production build with firebase@9.9.2, but not when using firebase@9.9.1. As in simply swapping those dependencies reveals or fixes the problem. Angularfire 7.4.1, latest everything else. Also affects app.performance it seems. Using compat as instructed here. A webpack issue?

ERROR TypeError: app.auth is not a function
    at angular-fire-compat-auth.js:59:51
    at _ZoneDelegate.invoke (zone.js:372:26)
    at Zone.run (zone.js:134:43)
    at NgZone.runOutsideAngular (core.mjs:26253:28)
    at angular-fire-compat-auth.js:59:23
    at ɵcacheInstance (angular-fire-compat.js:147:29)
    at ɵauthFactory (angular-fire-compat-auth.js:58:130)
    at new AngularFirestore (angular-fire-compat-firestore.js:513:25)
    at Object.AngularFirestore_Factory [as factory] (angular-fire-compat-firestore.js:584:1)
    at R3Injector.hydrate (core.mjs:6877:35)

...and 9.9.3 didn't change this problem...

weilinzung commented 2 years ago

We got that from compat mode.

main.40b0c58e10208b51.js:formatted:104832 Unhandled Promise rejection: ut.auth is not a function ; Zone: <root> ; Task: Promise.then ; Value: TypeError: ut.auth is not a function
        pe.cc)(`${ut.name}.auth`, "AngularFireAuth", ut.name, ()=>{
            const De = Bt.runOutsideAngular(()=>ut.auth()); => 
            if (st && De.useEmulator(...st),
            ct && (De.tenantId = ct),

https://github.com/angular/angularfire/blob/d724d81eafe003d2ec18728998cec7682aaaaeec/src/compat/auth/auth.ts#L29

aloisdasilva commented 2 years ago

I'm getting this even if not in a production build with firebase@9.9.2, but not when using firebase@9.9.1. As in simply swapping those dependencies reveals or fixes the problem. Angularfire 7.4.1, latest everything else. Also affects app.performance it seems. Using compat as instructed here. A webpack issue?

ERROR TypeError: app.auth is not a function
    at angular-fire-compat-auth.js:59:51
    at _ZoneDelegate.invoke (zone.js:372:26)
    at Zone.run (zone.js:134:43)
    at NgZone.runOutsideAngular (core.mjs:26253:28)
    at angular-fire-compat-auth.js:59:23
    at ɵcacheInstance (angular-fire-compat.js:147:29)
    at ɵauthFactory (angular-fire-compat-auth.js:58:130)
    at new AngularFirestore (angular-fire-compat-firestore.js:513:25)
    at Object.AngularFirestore_Factory [as factory] (angular-fire-compat-firestore.js:584:1)
    at R3Injector.hydrate (core.mjs:6877:35)

I have firebase 9.9.1 and still have this issue :/

spicemix commented 1 year ago

My problem turned out to be having different versions of firebase dependencies at the same time. angularfire brings in firebase itself, so there's no need for a direct dependency. Remove both, and just add back in angularfire, and see if that helps.

weilinzung commented 1 year ago

@spicemix thanks, I can confirm that your find is working for us as well.

We tested because we have firebase as a dependency. For our use case, we need to have firebasse, but we changed it as devDependency now, and is working as normal again.

And, we have all the latest devDependencies as below:

"devDependencies": {
    "firebase": "^9.9.3",
    "firebase-admin": "^11.0.1",
    "firebase-tools": "^11.8.0"
}
raybird commented 11 months ago

app.module.ts

    AngularFireModule.initializeApp(environment.firebase),
    AngularFirestoreModule,
    AngularFireAuthModule,
    AngularFireRemoteConfigModule,
    AngularFireFunctionsModule,
    provideFirebaseApp(() => initializeApp(environment.firebase)),

add provideAuth(() => getAuth()) gets rid of this issue and can build with optimization: true

    AngularFireModule.initializeApp(environment.firebase),
    AngularFirestoreModule,
    AngularFireAuthModule,
    AngularFireRemoteConfigModule,
    AngularFireFunctionsModule,
    provideFirebaseApp(() => initializeApp(environment.firebase)),
    provideAuth(() => getAuth())
EdmondMbadu commented 11 months ago

I am having this issue as well. The problem occurs only in production. I was able to reproduce it locally, and it does have to do with collisions in my case between angular fire and firebase. I removed firebase completely, but I am still having the issue in prod.

kavicastelo commented 10 months ago

Same issue firebase - 9.23 @angular/fire - 7.5 Angular CLI - 15.2

madmacc commented 7 months ago

Same issue: "firebase": 9.0.2 "@angular/fire": 7.4.1

optimization: false fixed the issue but size is massive.

severus1990 commented 6 months ago

Any updates on this issue other than optimization: false ?

brq-cr commented 5 months ago

"firebase": "9.23.0", "@angular/fire": "7.6.1",

fix the issue

optimization: false (is not required)

pawaraditya0204 commented 4 months ago

I have installed the latest versions of Firebase, which are "firebase": "^10.10.0" and "@angular/fire": "^17.0.1". This resolved my issue without needing to set the optimization flag to false.

I am using the angular 15 cli but we dont have any @angular/fire@15.0.0 like this may be in this method you will get per deep issues

kavyagamani commented 4 months ago

I am also using the same version of firebase and angular 17 cli but i am not able to solve the issue..pls help me