When running angular pro preview with trial license I see a type error in the console suggesting that the language management feature did not load #3708

9 Answer(s)

• 

  0

  alper created 2 years ago

  Support Team Director

  If you're using the Leptonx Theme, please remove the ThemeLeptonConfigModule.forRoot() import from your imports array. If you using the Lepton Theme, please configure your backend. if this doesn't help, let us know @muhammedaltug will help you to proceed with this problem.

  Save Cancel
• 

  0

  trevor.wilson created 2 years ago

  Hi Albert,

  I am using LeptonX theme, but I do not have ThemeLeptonConfigModule.forRoot() in my imports. Here is my app.module.ts:

  import { CoreModule } from '@abp/ng.core';
  import { GdprConfigModule } from '@volo/abp.ng.gdpr/config';
  import { SettingManagementConfigModule } from '@abp/ng.setting-management/config';
  import { ThemeSharedModule } 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 } from '@volo/abp.commercial.ng.ui/config';
  import { AccountAdminConfigModule } from '@volo/abp.ng.account/admin/config';
  import { AccountPublicConfigModule } from '@volo/abp.ng.account/public/config';
  import { AuditLoggingConfigModule } from '@volo/abp.ng.audit-logging/config';
  import { IdentityServerConfigModule } from '@volo/abp.ng.identity-server/config';
  import { IdentityConfigModule } from '@volo/abp.ng.identity/config';
  import { LanguageManagementConfigModule } from '@volo/abp.ng.language-management/config';
  import { registerLocale } from '@volo/abp.ng.language-management/locale';
  import { SaasConfigModule } from '@volo/abp.ng.saas/config';
  import { TextTemplateManagementConfigModule } from '@volo/abp.ng.text-template-management/config';
  import { HttpErrorComponent, ThemeLeptonModule } from '@volo/abp.ng.theme.lepton';
  import { environment } from '../environments/environment';
  import { AppRoutingModule } from './app-routing.module';
  import { AppComponent } from './app.component';
  import { APP_ROUTE_PROVIDER } from './route.provider';
  
  @NgModule({
    declarations: [AppComponent],
    imports: [
      BrowserModule,
      BrowserAnimationsModule,
      AppRoutingModule,
      CoreModule.forRoot({
        environment,
        registerLocaleFn: registerLocale(),
      }),
      ThemeSharedModule.forRoot({
        httpErrorConfig: {
          errorScreen: {
            component: HttpErrorComponent,
            forWhichErrors: [401, 403, 404, 500],
            hideCloseIcon: true,
          },
        },
      }),
      AccountAdminConfigModule.forRoot(),
      AccountPublicConfigModule.forRoot(),
      IdentityConfigModule.forRoot(),
      LanguageManagementConfigModule.forRoot(),
      SaasConfigModule.forRoot(),
      AuditLoggingConfigModule.forRoot(),
      IdentityServerConfigModule.forRoot(),
      TextTemplateManagementConfigModule.forRoot(),
      SettingManagementConfigModule.forRoot(),
      ThemeLeptonModule.forRoot(),
      CommercialUiConfigModule.forRoot(),
      GdprConfigModule.forRoot(),
    ],
    providers: [APP_ROUTE_PROVIDER],
    bootstrap: [AppComponent],
  })
  export class AppModule {}
  
  

  Do you see anything wrong there? Any other suggestions?

  Cheers!

  Trevor

  Save Cancel
• 

  0

  trevor.wilson created 2 years ago

  I installed @volosoft/abp.ng.theme.lepton-x via

  npm install @volosoft/abp.ng.theme.lepton-x@preview

  I removed ThemeLeptonModule from app.module.ts and shared.module.ts. I added "node_modules/bootstrap-icons/font/bootstrap-icons.css" to styles array in angular.json.

  I was not quite sure where to put the lpx theme overrides:

  :root {
    .lpx-theme-dark {
      --lpx-logo: url('/assets/images/logo/logo-light.svg');
      --lpx-logo-icon: url('/assets/images/logo/logo-light-icon.svg');
      --lpx-brand: #edae53;
    }
  
    .lpx-theme-dim {
      --lpx-logo: url('/assets/images/logo/logo-light.svg');
      --lpx-logo-icon: url('/assets/images/logo/logo-light-icon.svg');
      --lpx-brand: #f15835;
    }
  
    .lpx-theme-light {
      --lpx-logo: url('/assets/images/logo/logo-dark.svg');
      --lpx-logo-icon: url('/assets/images/logo/logo-dark-icon.svg');
      --lpx-brand: #69aada;
    }
  }
  

  However, I am still seeing the same error as before.

  Save Cancel
• 

  0

  trevor.wilson created 2 years ago

  I added the overrides to the root level styles.css. The only error I see in the console is:

      at MapSubscriber.mapFn [as project] (volo-abp.ng.language-management-common.mjs:11:1)
      at MapSubscriber._next (map.js:29:1)
      at MapSubscriber.next (Subscriber.js:49:1)
      at FilterSubscriber._next (filter.js:33:1)
      at FilterSubscriber.next (Subscriber.js:49:1)
      at DistinctUntilChangedSubscriber._next (distinctUntilChanged.js:50:1)
      at DistinctUntilChangedSubscriber.next (Subscriber.js:49:1)
      at MapSubscriber._next (map.js:35:1)
      at MapSubscriber.next (Subscriber.js:49:1)
      at BehaviorSubject.next (Subject.js:39:1)
  

  The theme appears to be working fine, but I am still unable to get localization to work. I believe this issue is related to the error above since the stack trace references the language-management-common.mjs.

  Save Cancel
• 

  0

  muhammedaltug created 2 years ago

  Hello,

  Can you send the application-configuration endpoint response?

  Save Cancel
• 

  0

  trevor.wilson created 2 years ago

  Here is the response from the application-configuration endpoint:

  Save Cancel
• 

  0

  muhammedaltug created 2 years ago

  Hello,

  According to the response of the application-configuration endpoint, your backend seems to be created with open source app template. Please check if the 2 projects are created with the app-pro template.

  Save Cancel
• 

  0

  trevor.wilson created 2 years ago

  Thank you muhammedaltug. .The angular project is created with the app-pro template, but the dotnet project was not. I have upgraded the dotnet project to the preview version of angular. I am wondering if there a way for me to switch an existing dotnet solution to use the app-pro template?

  Save Cancel
• 

  0

  maliming created 2 years ago

  Support Team Fullstack Developer

  hi trevor.wilson

  . I am wondering if there a way for me to switch an existing dotnet solution to use the app-pro template?

  You can only manually create a new app-pro project, and then refer to the new project to replace the open source package with the pro package. Just compare projects.

  Save Cancel