Can't get Angular compiler error in browser Console

Question

When I have an error in my Typescript code I can't get the browser Console window to display the compiler error. Instead I get this:

Uncaught Error: Angular JIT compilation failed: '@angular/compiler' not loaded!
  - JIT compilation is discouraged for production use-cases! Consider AOT mode instead.
  - Did you bootstrap using '@angular/platform-browser-dynamic' or '@angular/platform-server'?
  - Alternatively provide the compiler with 'import "@angular/compiler";' before bootstrapping.

What do I need to do to the Angular source files to fix this?

I am new to Angular and my setup is straight out of the box.

Here is my main.ts file:

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

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

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

platformBrowserDynamic().bootstrapModule(AppModule)
  .catch(err => console.error(err));

Answer 1

I had the same issue and I found this will fix by importing compiler in main.ts file

import '@angular/compiler';