Hi i recently started a new angular dontcore project with Lipton x theme when i build the project i only get a blank page with no errors.wgen i switched to basic theme the project worked perfectly. I am using abp latest release
6 Answer(s)
-
0
- 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 thestyles
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
, removeThemeBasicModule
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.
-
0
hi
Are there any error messages in the Browser console?
Thanks.
-
0
[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
-
0
hi
What is the output of the angular yarn start command?
Thanks.
-
0
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
-
0
the ouput window dose not show anything