How to use ngx-highlightjs - 10 common examples

import { SharedModule } from '../shared/shared.module';

import { ToolbarComponent } from './layout/toolbar/toolbar.component';
import { NavigationComponent } from './layout/navigation/navigation.component';
import { FooterComponent } from './layout/footer/footer.component';

export function hljsLanguages() {
  return [{ name: 'typescript', func: typescript }];
}

@NgModule({
  declarations: [ToolbarComponent, NavigationComponent, FooterComponent],
  imports: [
    // vendor
    RouterModule,
    HighlightModule.forRoot({
      languages: hljsLanguages
    }),

    // local
    SharedModule
  ],
  exports: [ToolbarComponent, NavigationComponent, FooterComponent]
})
export class CoreModule {}

import { SharedModule } from './shared/shared.module';
import { NgcCookieConsentModule } from 'ngx-cookieconsent';
import { cookieConfig } from './core/configs/cookie-consent';

@NgModule({
    declarations: [
        AppComponent,
    ],
    imports: [
        BrowserModule,
        BrowserAnimationsModule,
        HttpClientModule,
        AppRoutingModule,
        CoreModule,
        SharedModule,
        HighlightModule.forRoot({languages: () => [{name: 'yaml', func: yaml}]}),
        NgcCookieConsentModule.forRoot(cookieConfig)
    ],
    providers: [
        ApiService,
        TitleService
    ],
    bootstrap: [AppComponent]
})
export class AppModule {
}

AppComponent,
        CodeExampleComponent,
        AppTemplateDrivenUseCaseComponent,
        AppReactiveDrivenUseCaseComponent,
        CustomSelectComponent,
        AppAddressControlComponent
    ],
    imports: [
        BrowserModule,
        FormsModule,
        ReactiveFormsModule,
        NgxValidatorModule.forRoot({
            validateOn: 'submit',
            globalValidationMessages: GLOBAL_VALIDATION_MESSAGES
        }),
        HighlightModule.forRoot({
            languages: hljsLanguages
        }),
        RouterModule.forRoot(
            [
                {
                    path: '',
                    redirectTo: 'template',
                    pathMatch: 'full'
                },
                {
                    path: 'template',
                    component: AppTemplateDrivenUseCaseComponent
                },
                {
                    path: 'reactive',
                    component: AppReactiveDrivenUseCaseComponent

{
      name: 'typescript',
      func: typescript,
    },
    {
      name: 'xml',
      func: xml,
    },
  ];
}

@NgModule({
  imports: [
    CommonModule,
    RouterModule,
    HighlightModule.forRoot({
      languages: hljsLanguages,
    }),
    TabsModule.forRoot(),
  ],
  exports: [
    CommonModule,
    RouterModule,
    SideNavComponent,
    FormsModule,
    TabsModule,
    CodeComponent,
  ],
  declarations: [
    SideNavComponent,
    CodeComponent,
  ],

{name: 'less', func: less},
        {name: 'xml', func: xml},
    ];
}

@NgModule({
    bootstrap: [AppComponent],
    imports: [
        BrowserModule.withServerTransition({appId: 'demo'}),
        InputDemoModule,
        MenuDemoModule,
        ComboBoxDemoModule,
        TabsDemoModule,
        StarWarsModule,
        StarWarsDemoModule,
        HighlightModule.forRoot({
            languages: hljsLanguages,
        }),
    ],
    declarations: [AppComponent],
    providers: [
        {
            provide: LocationStrategy,
            useClass: PathLocationStrategy,
        },
        {
            provide: DomSanitizer,
            useClass: NgDompurifyDomSanitizer,
        },
    ],
})
export class AppBrowserModule {}

import { HomeRoutingModule } from './home-routing.module';
import { HomeComponent } from './home.component';
import {MatButtonModule, MatTabsModule, MatToolbarModule, MatTooltipModule} from '@angular/material';

export function hljsLanguages() {
    return [
      {name: 'typescript', func: typescript},
    ];
  }
@NgModule({
  imports: [
    CommonModule,
    BrowserAnimationsModule,
    MatProgressButtonsModule.forRoot(),
    HighlightModule.forRoot({languages: hljsLanguages}),
    HomeRoutingModule,
    MatButtonModule,
    MatTabsModule,
    MatToolbarModule,
    MatTooltipModule
  ],
    declarations: [HomeComponent],
})
export class HomeModule { }

MatTooltipModule,
  MatButtonModule
} from '@angular/material';
import {FlexLayoutModule} from '@angular/flex-layout';
import {FormsModule, ReactiveFormsModule} from '@angular/forms';
import {HighlightModule} from 'ngx-highlightjs';
import {NgxMaterialPagesModule} from 'ngx-material-pages';
import {MatContactsModule} from '@angular-material-extensions/contacts';

@NgModule({
  imports: [
    RouterModule,
    NgbCollapseModule,
    MatContactsModule.forRoot(),
    NgxMaterialPagesModule.forRoot(),
    HighlightModule.forRoot(),
    FormsModule,
    ReactiveFormsModule,
    FlexLayoutModule,
    MatCardModule,
    MatInputModule,
    MatIconModule,
    MatDividerModule,
    MatProgressBarModule,
    MatSlideToggleModule,
    MatSnackBarModule,
    MatTooltipModule,
    MatButtonModule
  ],
  exports: [
    HeaderComponent,
    FooterComponent,

@NgModule({
  declarations: [
    AppComponent,
    HomeComponent,
    ProfileComponent,
    NavBarComponent,
    FooterComponent,
    HeroComponent,
    HomeContentComponent,
    LoadingComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    NgbModule,
    HighlightModule.forRoot({
      languages: hljsLanguages
    }),
    FontAwesomeModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

const routes: Routes = [
    { path: '', loadChildren: './documentation/documentation.module#DocumentationModule' },
    { path: '**', redirectTo: '/home' }
];

@NgModule({
    declarations: [AppComponent],
    imports: [
        BrowserAnimationsModule,
        RouterModule.forRoot(routes, {
            scrollPositionRestoration: 'enabled',
            anchorScrolling: 'enabled'
        }),
        HttpClientModule,
        MarkdownModule.forRoot({ loader: HttpClient }),
        HighlightModule.forRoot({ languages: hljsLanguages })
    ],
    bootstrap: [AppComponent],
    entryComponents: []
})
export class AppModule {}

{name: 'scss', func: scss},
    {name: 'xml', func: xml}
  ];
}

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    BrowserAnimationsModule,
    AppRoutingModule,
    HttpClientModule,
    HttpClientJsonpModule,
    HighlightModule.forRoot({
      languages: hljsLanguages
    }),
    NgProgressModule,
    NgProgressHttpModule,
    NgProgressRouterModule,
    SharedModule
  ],
  providers: [
    DocsService,
    {
      provide: SHARE_BUTTONS_CONFIG,
      useValue: {
        twitterAccount: 'MurhafSousli',
        theme: 'material-dark',
        debug: true
      }