import { NgModule , ApplicationRef } from "@angular/core" ; import { BrowserModule } from "@angular/platform-browser" ; import { RouterModule , PreloadAllModules } from "@angular/router" ; import { FormsModule , ReactiveFormsModule } from "@angular/forms" ; import { ENV_PROVIDERS } from "./environment" ; import { ROUTES } from "./app.routes" ; import { AppComponent } from "./app.component" ; import { CoreModule } from "./core" ; import { HomeModule } from "./pages/home/home.module" ; import { AuthModule } from "./pages/auth/auth.module" ; import { TopModule } from "./pages/top/top.module" ; import { NoContentComponent } from "./pages/no-content/no-content.component" ; import { HeaderModule } from "./components/header/header.module" ; import { SharedModule } from "./shared/shared.module" ; import { removeNgStyles , createInputTransfer , createNewHosts } from "@angularclass/hmr" ; @ NgModule ( { bootstrap : [ AppComponent ] , declarations : [ AppComponent , NoContentComponent , ] , imports : [ BrowserModule , RouterModule . forRoot ( ROUTES , { preloadingStrategy : PreloadAllModules } ) , FormsModule , ReactiveFormsModule , CoreModule , SharedModule , HomeModule , AuthModule , TopModule , HeaderModule , ] , providers : [ ENV_PROVIDERS , ] } ) export class AppModule { constructor ( public appRef ) { } hmrOnInit ( store ) { if ( ! store || ! store . state ) return ; console . log ( 'HMR store' , store ) ; console . log ( 'store.state.data:' , store . state . data ) ; if ( 'restoreInputValues' in store ) { store . restoreInputValues ( ) ; } this . appRef . tick ( ) ; delete store . state ; delete store . restoreInputValues ; } hmrOnDestroy ( store ) { const cmpLocation = this . appRef . components . map ( cmp => cmp . location . nativeElement ) ; store . disposeOldHosts = createNewHosts ( cmpLocation ) ; store . state = { data : 'yolo' } ; store . restoreInputValues = createInputTransfer ( ) ; removeNgStyles ( ) ; } hmrAfterDestroy ( store ) { store . disposeOldHosts ( ) ; delete store . disposeOldHosts ; } }