Angular Firebase Error: "NullInjectorError: No provider for Firestore2!" in Standalone...

I'm working on an Angular standalone component using Firebase, and I'm encountering the following error:

ERROR NullInjectorError: R3InjectorError(Standalone[_AppComponent])[_FirebaseService -> _FirebaseService -> Firestore2 -> Firestore2]: NullInjectorError: No provider for Firestore2!

I have already installed @angular/fire and initialized Firebase in my project. My _FirebaseService is trying to use Firestore like this:

import { inject } from '@angular/core';
import { Firestore } from '@angular/fire/firestore';

export class _FirebaseService {
private firestore = inject(Firestore);

}


I also added the Firebase providers in main.ts:

bootstrapApplication(AppComponent, {
providers: [
provideFirebaseApp(() => initializeApp(environment.firebase)),
provideFirestore(() => getFirestore()),

],
});


Still, the error persists. I suspect it's related to using standalone components, but I'm not sure what's missing.

What I've tried:

Ensuring provideFirestore() is called in main.ts

Restarting the dev server

Verifying correct Firebase config


What could be causing the "No provider for Firestore2" error in an Angular standalone component setup with Firebase? How can I fix it so Firestore is properly injected?

Continue reading...