When integrating angular/fire 7.5 with angular 15, get error Need to provide options, when not being deployed to hosting via source

Question

I am porting an app from angular8 with angular/fire 5.4 to angular15 with angular/fire 7.5. I added the following to my AppModule imports section

import { provideFirebaseApp, initializeApp } from '@angular/fire/app';
import { provideFirestore, getFirestore } from '@angular/fire/firestore';
import { provideStorage, getStorage } from '@angular/fire/storage';
import { provideAuth, getAuth } from '@angular/fire/auth';
import { provideFunctions, getFunctions } from '@angular/fire/functions';

imports: [

    ... 
    AngularFireModule.initializeApp(environment.firebaseConfig),
    AngularFireStorageModule,
    AngularFirestoreModule,
    AngularFireAuthModule,
    AngularFireFunctionsModule,


    provideFirebaseApp(() => initializeApp(environment.firebaseConfig)),
    provideAuth(() => getAuth()),
    provideFirestore(() => getFirestore()),
    provideStorage(() => getStorage()),
    provideFunctions(() => getFunctions()),

    ...
],
providers: [
     { provide: FIREBASE_OPTIONS, useValue: environment.firebaseConfig }
]

But I am getting this error message: What am I missing?

main.ts:14 FirebaseError: Firebase: Need to provide options, when not being deployed to hosting via source. (app/no-options).
    at initializeApp (index.esm2017.js:423:29)
    at getApp (index.esm2017.js:476:16)
    at getFunctions (index.esm2017.js:666:35)
    at angular-fire.js:227:48
    at angular-fire.js:160:59
    at _ZoneDelegate.invoke (zone.js:372:26)
    at Zone.run (zone.js:134:43)
    at NgZone.runOutsideAngular (core.mjs:24212:28)
    at runOutsideAngular (angular-fire.js:160:35)
    at angular-fire.js:227:21
    ```

Answer 1

I figured it out. I had a service which used AngularFireAuth but was not imported from the compat folder. So while it compiled, it gave me that error during runtime. So if you use the compat mode of angularfire use it everywhere