new API for @angular/fire

[AscanderS]

Use for example

import { AngularFireModule } from '@angular/fire/compat'; import { AngularFirestoreModule } from '@angular/fire/compat/firestore';

Instead of

import { AngularFireModule } from '@angular/fire'; import { AngularFirestoreModule } from '@angular/fire/firestore';

Thanks.

[dclements]

Alternatively it can be done with something like provideFirebaseApp(() => initializeApp(environment.firebase))

[rinologic]

Please note that in addition to the change above regarding the use of compat mode, you may also need to update interface.d.ts in the firestore node module library (screenshot attached). I had to make this update too before things started working. I found this in a thread in that library's issues. I am using @angular/fire 7.5.0 with Angular 15.

[natereprogle]

Please note that in addition to the change above regarding the use of compat mode, you may also need to update interface.d.ts in the firestore node module library (screenshot attached). I had to make this update too before things started working. I found this in a thread in that library's issues. I am using @angular/fire 7.5.0 with Angular 15.

Don't go manually editing files, this doesn't work in actual production environments anyway. Instead, do what this commenter did. It's native and works amazingly.

While you're at it, you may experience issues with rxfire. Do what this guy did. It's also a native solution, but requires pnpm (If you aren't using pnpm already, however, you should 😊)

You can also do the same thing if you chose to use npm, by doing the following:

{
  "overrides": {
    "rxfire": {
      "tslib": "^2.3.1"
    }
  }
}