Importing Modules
Example import of JhaResponsiveModule
// example of importing the JhaResponsiveCoreModule into app.module
import { JhaResponsiveCoreModule } from '@jha/jharesponsive/jha-responsive-core';
@NgModule({
imports: [
JhaResponsiveCoreModule.forRoot(),
...
]
})
export class AppModule(){}
Importing the JhaResponsiveCoreModule requires the .forRoot() method in order to create singleton services required for Responsive UI.
// example of importing all Responsive UI modules into app.module
import { JhaButtonsModule } from '@jha/jharesponsive/jha-buttons';
import { JhaDialogBoxModule } from '@jha/jharesponsive/jha-dialog-box';
import { JhaFloatingToolbarModule } from '@jha/jharesponsive/jha-floating-toolbar';
import { JhaHeaderModule } from '@jha/jharesponsive/jha-header';
import { JhaFormsModule } from '@jha/jharesponsive/jha-forms';
import { JhaIconModule } from '@jha/jharesponsive/jha-icon';
import { JhaLayoutModule } from '@jha/jharesponsive/jha-layout';
import { JhaMasterDetailModule } from '@jha/jharesponsive/jha-master-detail';
import { JhaMegaMenuModule } from '@jha/jharesponsive/jha-mega-menu';
import { JhaNavModule } from '@jha/jharesponsive/jha-nav';
import { JhaNotificationsModule } from '@jha/jharesponsive/jha-notifications';
import { JhaPasswordStrengthMeterModule } from '@jha/jharesponsive/jha-password-strength-meter';
import { JhaPercentageCircleModule } from '@jha/jharesponsive/jha-percentage-circle';
import { JhaPipesModule } from '@jha/jharesponsive/jha-pipes';
import { JhaProgressBarModule } from '@jha/jharesponsive/jha-progress-bar';
import { JhaRatingModule } from '@jha/jharesponsive/jha-rating';
import { JhaResponsiveCoreModule } from '@jha/jharesponsive/jha-responsive-core';
import { JhaTagsModule } from '@jha/jharesponsive/jha-tags';
import { JhaThemeModule } from '@jha/jharesponsive/jha-theme';
import { JhaTileModule } from '@jha/jharesponsive/jha-tile';
import { JhaToggleModule } from '@jha/jharesponsive/jha-toggle';
@NgModule({
imports: [
JhaButtonsModule,
JhaDialogBoxModule,
JhaFloatingToolbarModule,
JhaHeaderModule,
JhaFormsModule.forRoot(),
JhaIconModule,
JhaLayoutModule,
JhaMasterDetailModule,
JhaMegaMenuModule,
JhaNavModule,
JhaNotificationsModule,
JhaPasswordStrengthMeterModule,
JhaPercentageCircleModule,
JhaPipesModule,
JhaProgressBarModule,
JhaRatingModule,
JhaResponsiveCoreModule.forRoot(),
JhaTagsModule,
JhaThemeModule,
JhaTileModule,
JhaToggleModule,
...
]
})
export class AppModule(){}
Upgrading from v2018.3.0
When updating existing solutions that implemented the single JhaResponsiveModule structure (Version 2018.3.0 and previous), start by searching the solution for @jha and updating the path to match the new structure. The new structure can be found in the installed package ([solution root]/node_modules/@jha/jharesponsive). Path updates will include bundle arrays in the angular.json and any service or class imports into the components.
Next, update the app.module from importing the JhaResponsiveModule to the JhaResponsiveCoreModule and build the site. Any errors will show you possible other paths that need to be updated.
Once the solution builds, load it in the browser and review the inspector console to see which components are not recognized. Find the module that cooresponds with the erroring component by referencing the module structure above, and add that module to your app.module.ts following the implementation instructions below.
The vast majority of solutions will at least need to import the following modules:
JhaResponsiveCoreModuleJhaHeaderModuleJhaLayoutModuleJhaNavModule