Upgrade 8.x to 9.0 - NullInjectorError: No provider for InjectionToken CORE_OPTIONS #9071 | Support

mateusz.krauze created 4 days ago

ABP Framework version: 8.1.1
UI Type: Angular
Database System: EF Core (MSSQL)
Auth Server Separated (for Angular): Yes
Exception message and full stack trace :NullInjectorError: No provider for InjectionToken CORE_OPTIONS

ERROR NullInjectorError: R3InjectorError(AppModule)[ApplicationInitStatus -> InjectionToken Application Initializer -> [object Object] -> ProfilePictureService -> RestService -> InjectionToken CORE_OPTIONS -> InjectionToken CORE_OPTIONS]: 
  NullInjectorError: No provider for InjectionToken CORE_OPTIONS!
    Angular 5
    RestService_Factory abp-ng.core.mjs:56
    Angular 6
    ProfilePictureService_Factory volo-abp.commercial.ng.ui-config.mjs:56
    Angular 54
    84429 main.ts:11
    Webpack 7
core.mjs:7404:22
    Angular 29
    84429 main.ts:11
    Webpack 7

Hi,
I updated ABP version from 8.1.1 to 9.0 and i've got error above in runtime. I checked all the tips from the forum but without success. Compilation goes fine, but frontend not working. Removing lock file and modules doesn't help. Here is my package list:

  "dependencies": {
    "@abp/ng.account": "~9.0.0",
    "@abp/ng.components": "~9.0.0",
    "@abp/ng.core": "~9.0.0",
    "@abp/ng.identity": "~9.0.0",
    "@abp/ng.oauth": "~9.0.0",
    "@abp/ng.setting-management": "~9.0.0",
    "@abp/ng.theme.shared": "~9.0.0",
    "@angular/animations": "18",
    "@angular/cdk": "18",
    "@angular/common": "18",
    "@angular/compiler": "18",
    "@angular/core": "18",
    "@angular/forms": "18",
    "@angular/localize": "18",
    "@angular/platform-browser": "18",
    "@angular/platform-browser-dynamic": "18",
    "@angular/router": "18",
    "@fullcalendar/angular": "6.1.10",
    "@fullcalendar/core": "6.1.10",
    "@fullcalendar/daygrid": "6.1.10",
    "@fullcalendar/interaction": "6.1.10",
    "@fullcalendar/timegrid": "6.1.10",
    "@microsoft/signalr": "8.0.0",
    "@ng-bootstrap/ng-bootstrap": "16",
    "@popperjs/core": "^2.11.8",
    "@typescript-eslint/utils": "7.7.0",
    "@volo/abp.commercial.ng.ui": "~9.0.0",
    "@volo/abp.ng.account": "~9.0.0",
    "@volo/abp.ng.audit-logging": "~9.0.0",
    "@volo/abp.ng.gdpr": "~9.0.0",
    "@volo/abp.ng.identity": "~9.0.0",
    "@volo/abp.ng.language-management": "~9.0.0",
    "@volo/abp.ng.openiddictpro": "~9.0.0",
    "@volo/abp.ng.saas": "~9.0.0",
    "@volo/abp.ng.text-template-management": "~9.0.0",
    "@volosoft/abp.ng.theme.lepton-x": "3.3.4",
    "file-saver": "^2.0.5",
    "jquery": "^3.7.1",
    "jquery-ui-dist": "^1.13.2",
    "jspdf": "^2.5.1",
    "jspdf-autotable": "^3.5.29",
    "moment": "^2.29.4",
    "ngx-logger": "^5.0.11",
    "primeicons": "7.0.0",
    "primeng": "17.13.0",
    "rxjs": "~7.8.0",
    "source-map": "0.7.4",
    "tslib": "^2.0.0",
    "xlsx": "^0.18.5",
    "zone.js": "~0.14.0"
  },
  "devDependencies": {
    "@abp/ng.schematics": "~9.0.0",
    "@angular-devkit/build-angular": "18",
    "@angular-eslint/builder": "18",
    "@angular-eslint/eslint-plugin": "18",
    "@angular-eslint/eslint-plugin-template": "18",
    "@angular-eslint/schematics": "18",
    "@angular-eslint/template-parser": "18",
    "@angular/cli": "18",
    "@angular/compiler-cli": "18",
    "@angular/language-service": "18",
    "@types/jasmine": "~3.6.0",
    "@types/node": "^20.0.0",
    "@typescript-eslint/eslint-plugin": "6.9.1",
    "@typescript-eslint/parser": "6.9.1",
    "eslint": "^8.0.0",
    "jasmine-core": "~4.0.0",
    "karma": "~6.3.0",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage": "~2.1.0",
    "karma-jasmine": "~4.0.0",
    "karma-jasmine-html-reporter": "^1.7.0",
    "ng-packagr": "^17.3.0",
    "typescript": "5.4.5"
  }

Here is my app.module.ts file:

import { CoreModule, provideAbpCore, withOptions } from '@abp/ng.core';
import { GdprConfigModule, provideGdprConfig, withCookieConsentOptions } from '@volo/abp.ng.gdpr/config';
import { provideSettingManagementConfig, SettingManagementConfigModule } from '@abp/ng.setting-management/config';
import { ThemeSharedModule, CUSTOM_ERROR_HANDLERS, provideAbpThemeShared, withHttpErrorConfig } from '@abp/ng.theme.shared';
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { CommercialUiConfigModule, provideCommercialUiConfig } from '@volo/abp.commercial.ng.ui/config';
import { AuditLoggingConfigModule, provideAuditLoggingConfig } from '@volo/abp.ng.audit-logging/config';
import { IdentityConfigModule, provideIdentityConfig } from '@volo/abp.ng.identity/config';
import { provideLanguageManagementConfig } from '@volo/abp.ng.language-management/config';
import { registerLocale } from '@volo/abp.ng.language-management/locale';
import { provideTextTemplateManagementConfig } from '@volo/abp.ng.text-template-management/config';
import { HttpErrorComponent, ThemeLeptonXModule } from '@volosoft/abp.ng.theme.lepton-x';
import { SideMenuLayoutModule } from '@volosoft/abp.ng.theme.lepton-x/layouts';
import { environment } from '../environments/environment';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { APP_ROUTE_PROVIDER } from './route.provider';
import { provideOpeniddictproConfig } from '@volo/abp.ng.openiddictpro/config';
import { provideFeatureManagementConfig } from '@abp/ng.feature-management';
import { provideAbpOAuth } from '@abp/ng.oauth';
import { LoggerModule, NgxLoggerLevel } from 'ngx-logger';
import { ConfirmationService } from 'primeng/api';
import { CustomErrorHandlerService } from './utils/error-handling/http-error-handler.service';

@NgModule({
  declarations: [AppComponent],
  imports: [
    BrowserModule,
    BrowserAnimationsModule,
    AppRoutingModule,
    CoreModule,
    ThemeSharedModule,
    IdentityConfigModule,
    AuditLoggingConfigModule,
    SettingManagementConfigModule,
    ThemeLeptonXModule.forRoot(),
    SideMenuLayoutModule.forRoot(),
    CommercialUiConfigModule,
    GdprConfigModule,
    LoggerModule.forRoot({
      level: environment.production ? NgxLoggerLevel.WARN : NgxLoggerLevel.TRACE,
      colorScheme: ['purple', 'teal', 'gray', 'gray', 'red', 'red', 'red'],
      enableSourceMaps: !environment.production,
      disableConsoleLogging: environment.production
    }),
  ],
  providers: [
    APP_ROUTE_PROVIDER,
    { provide: CUSTOM_ERROR_HANDLERS, useExisting: CustomErrorHandlerService, multi: true },
    ConfirmationService,
    provideAbpCore(
      withOptions({
        environment,
        registerLocaleFn: registerLocale(),
      })
    ),
    provideAbpOAuth(),
    provideAbpThemeShared(withHttpErrorConfig({
      errorScreen: {
        component: HttpErrorComponent,
        forWhichErrors: [401, 403, 404, 500],
        hideCloseIcon: true,
      }
    })),
    provideIdentityConfig(),
    provideLanguageManagementConfig(),
    provideAuditLoggingConfig(),
    provideOpeniddictproConfig(),
    provideTextTemplateManagementConfig(),
    provideSettingManagementConfig(),
    provideCommercialUiConfig(),
    provideFeatureManagementConfig(),
    provideGdprConfig(withCookieConsentOptions({
      cookiePolicyUrl: 'gdpr-cookie-consent/cookie',
      privacyPolicyUrl: 'gdpr-cookie-consent/privacy'
    })),
  ],
  bootstrap: [AppComponent],
})
export class AppModule { }

Please help with this one.
Best regards