DEV Community

OliBlade
OliBlade

Posted on • Originally published at Medium on

Prerender your Angular app, as simple as possible

Have you ever wanted a simple static site, but you won’t want to lose Angular in the process? Here’s how you do it.

Getting started

Make sure your Angular CLI and Angular version is up to date, you can check with ng version, and update with ng update. Version 9+ should do it

My Angular version

From start to finish

  1. Start a new Angular Project using the CLI with ng new
  2. Install Angular Universal Express Engine using the CLI ng add @nguniversal/express-engine
  3. Add the routes you would like to prerender to the “prerender” -> “routes” array in the angular.json

  1. Prerender the content with npm run prerender . This will generate the prerendered files in “dist” -> MyApp -> “browser”. Note how you have “index.html” with the prerendered content and “index.original.html” with the original copy

And that’s it... Bob is indeed my uncle.

Top comments (0)