Static site generation produces mainly static Angular pages at build time instead of rendering them for each user request. Angular discovers configured routes during ng build and emits HTML files that can be served immediately, reducing runtime work and JavaScript requirements. section 9.3.3 section 9.4.4
A typical implementation follows this path:
- Create standalone page components and connect them through Angular routes. section 9.3.3
- Enable the prerender option in angular.json; optionally provide a routes file for additional paths. section 9.3.3
- Run ng build and deploy the generated browser folder as static hosting artifacts. section 9.4.4
- Configure the host to return index.html for unknown routes when client-side navigation or direct route requests would otherwise produce 404 errors. section 9.4.4
HRMS promotional site
An HRMS promotional application containing mostly text and images can prerender its about-us and subscriptions routes. After ng build, the browser output contains an index.html file under the about-us directory and other deployable static artifacts, allowing pages to be served without rendering them on demand. section 9.3.3 section 9.4.4
Listing 9.15 Application routing config
import { Routes } from '@angular/router';
import { AboutUsComponent } from './components/about-us.component';
import { SubscriptionsComponent } from './components/subscriptions.component';
export const routes: Routes = [
{ path: 'about-us', component: AboutUsComponent },
{ path: 'subscriptions', component: SubscriptionsComponent },
];
Inspect the routing configuration that supplies the about-us and subscriptions paths to the prerendering build. section 9.3.3
