Blank page #9965

7 Answer(s)

• 

  0

  AI-Bot created one year ago

  Support Team ABP Agent

  • Ensure you have installed the correct LeptonX theme package for Angular. For the open-source version, run:

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

  or

  yarn add @abp/ng.theme.lepton-x@preview
  

  • Update your angular.json file. In the styles array, remove the default Bootstrap style and add:

  "node_modules/@volo/ngx-lepton-x.lite/styles/sidemenu-layout.min.css",
    "node_modules/bootstrap-icons/font/bootstrap-icons.css"
  

  • In your app.module.ts, remove ThemeBasicModule and import:

  import { ThemeLeptonXModule } from '@abp/ng.theme.lepton-x';
    import { SideMenuLayoutModule } from '@abp/ng.theme.lepton-x/layouts';
  
    @NgModule({
      imports: [
        ThemeLeptonXModule.forRoot(),
        SideMenuLayoutModule.forRoot(),
        // other imports
      ],
      // ...
    })
    export class AppModule {}
  

  • If you use Resource Owner Password Flow, also import:

  import { AccountLayoutModule } from '@abp/ng.theme.lepton-x/account';
  
    @NgModule({
      imports: [
        AccountLayoutModule.forRoot(),
        // ...
      ],
      // ...
    })
    export class AppModule {}
  

  • After making these changes, stop the Angular dev server if running, delete node_modules, and reinstall dependencies:

  rm -rf node_modules
    yarn
  

  or

  npm install
  

  • Restart the Angular dev server:

  yarn start
  

  or

  npm start
  

  If you still see a blank page, double-check that all theme-related modules are correctly imported and that the styles are properly referenced in angular.json.

  Sources

  • https://abp.io/community/articles/z0fqq5di
  • https://abp.io/docs/latest/ui-themes/lepton-x-lite/angular

  ---

  This response was generated by AI. If it didn’t solve your problem, feel free to post a new answer — our support team will jump in to help you soon.

  Markdown supported.

  Copy, paste, or drag & drop images and files (max 100 MB per file, 100 MB total per post)

  Save Cancel
• 

  0

  maliming created one year ago

  Support Team Fullstack Developer

  hi

  Are there any error messages in the Browser console?

  Thanks.

  Markdown supported.

  Copy, paste, or drag & drop images and files (max 100 MB per file, 100 MB total per post)

  Save Cancel
• 

  0

  alrashdi1989 created one year ago

  [maliming] said: hi

  Are there any error messages in the Browser console?

  Thanks.

  No errors the weird thing that it works on some of the browsers but others don't

  Markdown supported.

  Copy, paste, or drag & drop images and files (max 100 MB per file, 100 MB total per post)

  Save Cancel
• 

  0

  maliming created one year ago

  Support Team Fullstack Developer

  hi

  What is the output of the angular yarn start command?

  Thanks.

  Markdown supported.

  Copy, paste, or drag & drop images and files (max 100 MB per file, 100 MB total per post)

  Save Cancel
• 

  0

  alrashdi1989 created one year ago

  PS C:\Users\d3-1293\Documents\MOD-GIT\Attendence\Mod.Attendence.Frontend> yarn start yarn run v1.22.22 $ ng serve ✔ Browser application bundle generation complete. Initial chunk files | Names | Raw size vendor.js | vendor | 7.38 MB | devextreme-material.css, devextreme-material.js | devextreme-material | 869.99 kB | scripts.js | scripts | 500.22 kB | bootstrap.css, bootstrap.js | bootstrap | 349.55 kB | polyfills.js | polyfills | 260.59 kB | fontawesome.css, fontawesome.js | fontawesome | 198.16 kB | leptonx-layout.css, leptonx-layout.js | leptonx-layout | 160.20 kB | leptonx-light.css, leptonx-light.js | leptonx-light | 129.70 kB | styles.css, styles.js | styles | 127.04 kB | main.js | main | 120.50 kB | runtime.js | runtime | 14.47 kB | | Initial total | 10.11 MB

  Markdown supported.

  Copy, paste, or drag & drop images and files (max 100 MB per file, 100 MB total per post)

  Save Cancel
• 

  0

  alrashdi1989 created one year ago

  the ouput window dose not show anything

  Markdown supported.

  Copy, paste, or drag & drop images and files (max 100 MB per file, 100 MB total per post)

  Save Cancel
• 

  0

  maliming created one year ago

  Support Team Fullstack Developer

  hi

  Could you share a demo app that reproduces the issue?

  liming.ma@volosoft.com Thanks

  Markdown supported.

  Copy, paste, or drag & drop images and files (max 100 MB per file, 100 MB total per post)

  Save Cancel