Angular debug tools (with HMR settings)

main.ts

import {ApplicationRef, enableProdMode} from '@angular/core';
import {enableDebugTools} from '@angular/platform-browser';
import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';

import {AppModule} from './app/app.module';
import {environment} from './environments/environment';

import {hmrBootstrap} from './hmr';


if (environment.production) {
	enableProdMode();
}

const bootstrap = () => platformBrowserDynamic().bootstrapModule(AppModule).then((module) => {
	if (!environment.production) {
		// ng.profiler.timeChangeDetection({record: true})
		const applicationRef = module.injector.get(ApplicationRef);
		const appComponent = applicationRef.components[0];
		enableDebugTools(appComponent);
	}

	return module;
});

if (environment.hmr) {
	if (module[ 'hot' ]) {
		hmrBootstrap(module, bootstrap);
	} else {
		console.error('HMR is not enabled for webpack-dev-server!');
		console.log('Are you using the --hmr flag for ng serve?');
	}
} else {
	bootstrap();
}