Anyone else still getting AngularFireModule has not been provided error?

[thatcatcancode]

I'm still getting this error on the latest rc release: Uncaught Error: AngularFireModule has not been provided at getSchedulers

Angular ^12.x.x, NgUniversal ^12.x.x, Firebase ^9.x.x, Angular Fire ^7.1.0-rc.4

Firestore is easy to configure using the angular fire 7 api 👍

The issues I have are specific to configuring Firebase Realtime Database (import { Database, ref } from '@angular/fire/database'). Do you see anything wrong with the below usage?

import { initializeApp } from '@angular/fire/app' import { getDatabase } from '@angular/fire/database' export function createFirebase(env: EnvironmentService) { const app = initializeApp(env.config.firebase) return getDatabase(app) } @NgModule({ providers: [ { provide: FIREBASE_APP_TOKEN, useFactory: createFirebase, deps: [EnvironmentService] }, { provide: FIREBASE_LIVE_STREAM_SERVICE, useClass: FirebaseLiveStreamService, deps: [FIREBASE_APP_TOKEN, TransferState, EnvironmentService, LOGGER_SERVICE] } ] }) export class FirebaseModule { static forRoot(): ModuleWithProviders<FirebaseModule> { return { ngModule: FirebaseModule } } } 

[pshields]

I've been seeing this as well and have been stumped about how to fix it.

[thatcatcancode]

are you also attempting to use getDatabase()?

[pshields]

No, just Firebase Authentication.

[besnikhaziri]

Hi there,
Can anyone help me with a problem I'm facing?
as soon as I write import { AngularFireModule } from 'angularfire2';, I get and immediate error like this:
error TS2694: Namespace '"node_modules/angularfire2/node_modules/@angular/core/core"' has no exported member 'ɵɵInjectorDeclaration'.

[Santoshah]

Maybe it is shifted to compat

import { AngularFireModule } from "@angular/fire/compat";

Try like this..

[sivanshkamat]

This is depricated and wont be used in angular 16, Do I have to use angularFireModule compulsorily?

[Albejr]

Possibly, you will solve it by passing the "app" as a parameter in the service's constructor.

I caught this problem when implementing a "Route Guard" (canLoad).

[pshields]

Thanks @Albejr, that resolved the issue in my case.

[thatcatcancode]

That did not solve my problem so I created this issue: #2999

[htrepo]

Thanks for the solution. Worked for me.

[davidev1902]

Thanks for the solution. Worked for me in Angular 18

[TheRealSamChaney]

In my case it was because I was not using an auth service but doing the authentication directly in my login component and signup component. I created a separate service with "ng g s auth" and moved the auth there like so:

import { Injectable } from '@angular/core'; import { Auth } from '@angular/fire/auth'; import { signInWithEmailAndPassword, createUserWithEmailAndPassword} from '@angular/fire/auth'; @Injectable({ providedIn: 'root' }) @Injectable() export class AuthService { constructor(private auth: Auth) { } signUp(email: string, password: string) { return createUserWithEmailAndPassword(this.auth, email, password); } login(email: string, password: string) { return signInWithEmailAndPassword(this.auth, email, password); } } 

And for example my login component now looks like this with the getAuth removed:

import { Component, OnInit } from '@angular/core'; import { FormControl } from '@angular/forms'; import { FormGroup } from '@angular/forms'; // import { Firestore, collectionData, collection, addDoc } from '@angular/fire/firestore'; import { AuthService } from '../auth.service'; @Component({ selector: 'app-signup', templateUrl: './signup.component.html', styleUrls: ['./signup.component.less'] }) export class SignupComponent implements OnInit { constructor(private authService: AuthService) {} form!: FormGroup; ngOnInit(): void { this.form = new FormGroup({ email: new FormControl(null), password: new FormControl(null) }); } onSubmit() { console.log(`Form is `, this.form); const email = this.form.value.email; const password = this.form.value.password; console.log(`In onSubmit and email is ${email} and password is ${password}`); this.authService.signUp(email, password) .then((userCredentials) => { const user = userCredentials.user; console.log(`User successfully created: ${user}`); }) .catch((error) => { const errorCode = error.code; const errorMessage = error.message; console.log(`Error signing up. Error code:${errorCode}, Error message:${errorMessage}`); }); } } 

[rgant]

This is not correct:

@Injectable({providedIn: 'root'}) @Injectable()

Don't do that twice.

[borisrose]

@rgant Have you found why my code does not work properly I gave you the code you wanted ( 54-line)

[rgant]

Try:

import{Injectable}from'@angular/core';import{// eslint-disable-line @typescript-eslint/consistent-type-imports -- Auth is Angular InjectedAuth,authState,createUserWithEmailAndPassword,signInWithEmailAndPassword,}from'@angular/fire/auth';importtype{User,UserCredential}from'@angular/fire/auth';importtype{Observable}from'rxjs'; @Injectable({providedIn: 'root'})exportclassAngularFireAuthService{publicreadonlyauthState$: Observable<User|null>;constructor(privatereadonlyauth: Auth){this.authState$=authState(this.auth);}publicasynccreateUserWithEmailAndPassword(email: string,password: string): Promise<UserCredential>{returncreateUserWithEmailAndPassword(this.auth,email,password);}publicasyncsignInWithEmailAndPassword(email: string,password: string): Promise<UserCredential>{returnsignInWithEmailAndPassword(this.auth,email,password);}}

[rgant]

@borisrose#3441 (comment)

[rgant]

And also:

import{Component}from'@angular/core';import{FormControl,FormGroup,Validators}from'@angular/forms';import{FirebaseError}from'@angular/fire/app';importtype{UserCredential}from'@angular/fire/auth';import{AuthService}from'../auth.service'; @Component({selector: 'app-signup',templateUrl: './signup.component.html',styleUrls: ['./signup.component.less']})exportclassSignupComponent{publicreadonlytheForm: FormGroup;constructor(privatereadonlyauthService: AuthService){this.theForm=newFormGroup({email: newFormControl(null,[Validators.required,Validators.email]),password: newFormControl(null,[Validators.required,Validators.minLength(6)])});}onSubmit(){if(this.theForm.invalid){thrownewError('onSubmit called with Invalid Form');}const{ email, password }=this.theForm.value;this.authService.createUserWithEmailAndPassword(email,password).then((userCredentials: UserCredential)=>{constuser=userCredentials.user;console.log(`User successfully created: ${user}`);}).catch((error: unknown): void=>{if(errorinstanceofFirebaseError){console.error(`Error signing up. Error code:${error.code}, Error message:${error.message}`);}else{console.error('Unknown Error',error);}});}}