Configuring applications to use ahead-of-time compilation

Angular 2 introduces the concept of ahead-of-time compilation (AOT). This is an alternate configuration in which you can run your applications to move some processing time from inside the browser (referred to as just-in-time compilation or JIT) to when you compile your application on the server.

Note

The code, links, and a live example related to this recipe are available at http://ngcookbook.herokuapp.com/9253/.

Getting ready

AOT compilation is application-agnostic, so you should be able to add this to any existing Angular 2 application with minimal modification.

For the purposes of this example, suppose you have an existing AppModule inside app/app.module.ts. You needn't concern yourself with its content since it is irrelevant for the purpose of AOT.

How to do it...

Using AOT means you will compile and bootstrap your application differently. Depending on how it is configured, you will probably want to use sibling files with "aot" added...