Can not inject service with Firestore witten in documentation

[benzmarkus]

Version info

Angular: 12

Firebase: newest

AngularFire: newest

How to reproduce these conditions

Used these modules in my app and then i created a simple service.
@NgModule({
declarations: [
AppComponent
],
imports : [
BrowserModule,
HttpClientModule,
BrowserAnimationsModule,
RouterModule.forRoot(appRoutes, routerConfig),

    // Fuse, FuseConfig & FuseMockAPI
    FuseModule,
    FuseConfigModule.forRoot(appConfig),
    FuseMockApiModule.forRoot(mockApiServices),

    // Core module of your application
    CoreModule,

    // Layout module of your application
    LayoutModule,

    FlexLayoutModule,

    // 3rd party modules that require global configuration via forRoot
    MarkdownModule.forRoot({}),
    AngularFireAuthModule,
    provideFirebaseApp(() => initializeApp(environment.firebaseConfig)),
    provideFirestore(() => getFirestore()),
    AngularFireModule.initializeApp(environment.firebaseConfig)
],
providers: [
    { provide: PERSISTENCE, useValue: 'session' }, SampleService 
  ],
bootstrap   : [
    AppComponent
]

})

This is the service and i injected it in the app component.

@Injectable({
providedIn: "root"
})
export class SampleService {
public constructor(private db: Firestore) {
}
}

Debug output

Error Message from Console
NullInjectorError: R3InjectorError(AppModule)[YoursEventService -> xc -> xc -> xc]:
NullInjectorError: No provider for xc!
at NullInjector.get (core.js:11101)
at R3Injector.get (core.js:11268)
at R3Injector.get (core.js:11268)
at R3Injector.get (core.js:11268)
at injectInjectorOnly (core.js:4751)
at Module.ɵɵinject (core.js:4755)
at Object.YoursEventService_Factory [as factory] (yours-event.service.ts:11)
at R3Injector.hydrate (core.js:11438)
at R3Injector.get (core.js:11257)
at NgModuleRef$1.get (core.js:25332)

Expected behavior

Can inject the service

Actual behavior

Throws error

[google-oss-bot]

This issue does not seem to follow the issue template. Make sure you provide all the required information.

[benzmarkus]

Some ideas ?

[benzmarkus]

FirestoreModule was missing!
Documentation should be updated.

[jorgutdev]

I encounter a similar issue trying to use Firestore. It was really dumb:

Using your example:

@Injectable({
  providedIn: "root"
})
export class SampleService {
  public constructor(private db: Firestore) {
  }
}

Problem was I was importing Firestore from firebase/firestore

import { Firestore } from 'firebase/firestore';      <--- WRONG
import { Firestore } from '@angular/fire/firestore'; <---- Use this one instead

[ashikjs]

Anyone get any solution ?