Angular 18 angular/fire not initializing

I have installed :

"@angular/fire": "^18.0.1",


Then i initializeApp in my app.config.ts :

....
provideFirebaseApp(() => initializeApp(environment.firebaseConfig)),
provideMessaging(() => getMessaging()),
....


And then i try to listen to notifications in my app.component.ts :

ngOnInit(): void {
if(this.platform.isBrowser){
this.requestPermission();
this.listen();
}
}

requestPermission() {
const messaging = getMessaging();

getToken(messaging, {
vapidKey: environment.vapidKey
}).then(
(currentToken) => {
if (currentToken) {
console.log('Your token is: ', currentToken);

} else {
console.log('No registration token available. Request permission to generate one.');
}
}
).catch((error) => {
console.log('An error occurred while retrieving token. ', error.message);
})


}

listen() {
const messaging = getMessaging();
onMessage(messaging, (payload) => {
console.log('Message received. ', payload);
this.message = payload;
})
}


And i get the following error - why ? :

Firebase: No Firebase App '[DEFAULT]' has been created - call initializeApp() first (app/no-app).
​

Continue reading...