No provider for [object Object]! appmodule find unknown module

This error had me stumped for the longest time, where my angular ionic5 app would compile, however, it just failed to run.

After trying organising my provider list to make it easier to compare what was or wasn’t loaded from other pages, I must have changed the order, which is what had made all the different.

While this isn’t the finished code, it’s a sample of what is now working for my app.module.ts file.

I did have the pages, under the providers section in a different order.

import { AppComponent } from './app.component';
import { AppRoutingModule } from './app-routing.module';
import { AuthService } from './auth.service';
import { BackgroundGeolocation, BackgroundGeolocationConfig, BackgroundGeolocationEvents, BackgroundGeolocationResponse } from '@ionic-native/background-geolocation/ngx';
import { BatteryStatus } from '@ionic-native/battery-status/ngx';
import { BrowserModule } from '@angular/platform-browser';
import { Component, OnInit, ViewChild, ElementRef, NgModule, NgZone, ChangeDetectorRef } from '@angular/core'; 
import { GlobalsService } from './globals.service';
import { HTTP } from '@ionic-native/http/ngx';
import { HttpClient, HttpClientModule, HttpHeaders    } from '@angular/common/http';
import { IonicStorageModule } from '@ionic/storage-angular';
import { JwtModule, JWT_OPTIONS } from '@auth0/angular-jwt';
import { LocalNotifications } from '@ionic-native/local-notifications/ngx';
import { HomePage  } from './home/home.page';
import { HomePageModule  } from './home/home.module';
import { LoginPage  } from './login/login.page';
import { LoginPageModule  } from './login/login.module';
import { MapPage } from './map/map.page';
import { MapPageModule } from './map/map.module';
import { NavController, ToastController, ModalController, Platform, NavParams, IonicModule, IonicRouteStrategy } from '@ionic/angular';
import { RouteReuseStrategy   } from '@angular/router';
import { RouterModule, Router } from '@angular/router';
import { SQLite, SQLiteObject } from '@ionic-native/sqlite/ngx';
import { StatusBar } from '@ionic-native/status-bar/ngx';
import { Storage } from '@ionic/storage'; 

@NgModule({
  declarations: [AppComponent],
  entryComponents: [],
  imports: [BrowserModule,   
    HttpClientModule,   
    HomePageModule,
    LoginPageModule,  
    MapPageModule,
    HttpClientModule, 
    IonicModule.forRoot(),
    AppRoutingModule,  
    IonicStorageModule.forRoot(),
    JwtModule.forRoot({
      jwtOptionsProvider: {
        provide: JWT_OPTIONS,
        useFactory: jwtOptionsFactory,
        deps: [Storage],
      }}),
    IonicModule.forRoot(), AppRoutingModule],
  providers: [
    HomePage,
    LoginPage,
    MapPage, 
    { provide: RouteReuseStrategy, useClass: IonicRouteStrategy },
    NavParams, 
    SQLite, 
    Component,
    StatusBar,
    GlobalsService,
    HTTP, 
    NavController,
    HttpClient,
    LocalNotifications,
    ModalController,
    BackgroundGeolocation,
    BatteryStatus, 
    ToastController, 
    AuthService, 
    Storage,
    NavParams, 
    IonicModule, 
    Platform,
    IonicRouteStrategy,
    HttpClientModule, 
    RouterModule    
  ], 
    exports: [ 
      SQLite  
  ],    
  bootstrap: [AppComponent],
})
export class AppModule {}

export function jwtOptionsFactory(storage) {
  return {
    tokenGetter: () => {
      return storage.get('access_token');
    },
    whitelistedDomains: ['localhost:5000', 'localhost:8888', 'localhost:8100']
  }
}