Angular 9 IVY Lazy Load Component с AngularFireMessagingModule R3InjectorError (AppBrowserModule) [InjectionToken angularfire2.app.options

Question

У меня есть приложение Angular, которое использует AngularFireMessagingModule для push-уведомлений.

В моей текущей конфигурации я добавил это в массив импорта моего модуля AppBrowser:

AngularFireModule.initializeApp({
  apiKey: "myAPIKey",
  projectId: "myProjectId",
  messagingSenderId: "myMessagingSenderId
  appId: "mhyAppId"
}),
AngularFireMessagingModule

В результате в основной пакет добавляется модуль firebase.

Поскольку с Angular 9 IVY мы можем отложить загрузку компонентов, я хочу отложить загрузку моего компонента уведомлений, который фактически использует AngularFireMessagingModule.

Я слежу за этим сообщением https://medium.com/angular-in-depth/lazy-load-components-in-angular-596357ab05d8, чтобы добиться этого.

Я удалил импорт вышеуказанных модулей из моего AppBrowserModule и создал новый файл с приведенным ниже кодом:

import { CommonModule } from '@angular/common';
import { HttpClient } from '@angular/common/http';
import { ChangeDetectorRef, Component, NgModule, ViewContainerRef } from '@angular/core';
import { AngularFireModule } from '@angular/fire';
import { AngularFireMessaging, AngularFireMessagingModule } from '@angular/fire/messaging';
import { MatButtonModule } from '@angular/material/button';
import { MatDialog, MatDialogModule, MatDialogRef } from '@angular/material/dialog';
import { StorageMap } from '@ngx-pwa/local-storage';
import { AuthService } from '../shared/services/auth.service';
import { GlobalService } from '../shared/services/global.service';
import { MediaService } from '../shared/services/media.service';

@Component({
  selector: 'enable-notifcations',
  templateUrl: './enable-notifications.component.html'
})
export class EnableNotificationsComponent {

  constructor(public viewContainerRef: ViewContainerRef,
    public dialog: MatDialog,
    private authService: AuthService,
    public _gs: GlobalService,
    public media: MediaService,
    private cdr: ChangeDetectorRef,

    private http: HttpClient,
    private messaging: AngularFireMessaging,
    private storage: StorageMap
  ) {
  }

  ngOnDestroy() {

  }
}

@NgModule({
  imports: [
    CommonModule,
    MatButtonModule,
    MatDialogModule,
    AngularFireModule.initializeApp({
      apiKey: "myAPIKey",
      projectId: "myProjectId",
      messagingSenderId: "myMessagingSenderId
      appId: "mhyAppId"
    }),
    AngularFireMessagingModule
    AngularFireMessagingModule
  ],
  declarations: [
    EnableNotificationsComponent
  ]
})
class EnableNotificationsModule { }

И в моем компоненте приложения я условно лениво загружаю этот компонент.

const { EnableNotificationsComponent } = await import(/* webpackPrefetch: true */'./account/enable-notifications.component');
const enableNotificationsComponentFactory = this.cfr.resolveComponentFactory(EnableNotificationsComponent);
this.enableNotificationsComponentInstance = this.enableNotificationsContainer.createComponent(enableNotificationsComponentFactory, null, this.injector);
this.enableNotificationsComponentInstance.instance.initNotifications();

Этот подход работает для других моих ленивых компонентов, но в этом случае он выдает ошибку ниже:

Unhandled Promise rejection: R3InjectorError(AppBrowserModule)[InjectionToken angularfire2.app.options -> InjectionToken angularfire2.app.options -> InjectionToken angularfire2.app.options]: 
  NullInjectorError: No provider for InjectionToken angularfire2.app.options! ; Zone: <root> ; Task: Promise.then ; Value: NullInjectorError: R3InjectorError(AppBrowserModule)[InjectionToken angularfire2.app.options -> InjectionToken angularfire2.app.options -> InjectionToken angularfire2.app.options]: 
  NullInjectorError: No provider for InjectionToken angularfire2.app.options!

Кто-нибудь может помочь, как это исправить?