Files
Hermes Agent 63bc2fb22d
CI Pipeline / backend-test (push) Successful in 5m39s
CI Pipeline / frontend-test (push) Successful in 27s
CI Pipeline / frontend-build (push) Successful in 30s
CI Pipeline / backend-lint (push) Successful in 9s
CI Pipeline / backend-test (pull_request) Successful in 5m24s
CI Pipeline / frontend-test (pull_request) Successful in 22s
CI Pipeline / frontend-build (pull_request) Successful in 30s
CI Pipeline / quality-gate (push) Successful in 2s
CI Pipeline / quality-gate (pull_request) Successful in 2s
CI Pipeline / backend-lint (pull_request) Successful in 8s
fix(ssr): remove broken dynamic import and lazy-init engine
- Replace await import('./main.server.js') with lazy getEngine()
  (original path was wrong — main.server.ts lives in src/, not root)
- AngularNodeAppEngine handles manifest registration internally;
  no manual bootstrap import needed
- Add npm scripts: build:ssr, build:prerender, serve:ssr:radio-station
- Add PRERENDER.md build documentation

Verified: clean build prerenders all 5 routes, 54 tests pass
2026-08-06 16:38:27 +00:00

3.2 KiB

Prerendering & SSR Build Guide

Overview

The KMountain Flower Radio application uses Angular SSR with prerendering (SSG — Static Site Generation) for its five public-facing routes. Prerendered routes are compiled to static HTML during ng build and served directly from disk at runtime.

Public Routes

All routes listed in prerender-routes.txt:

Route Build Output
/ dist/radio-station/browser/index.html
/about dist/radio-station/browser/about/index.html
/schedule dist/radio-station/browser/schedule/index.html
/events dist/radio-station/browser/events/index.html
/contact dist/radio-station/browser/contact/index.html

Configuration Files

File Purpose
angular.json Prerender + SSR config (prerender.routesFile, ssr.entry)
prerender-routes.txt One route per line — the list of routes to prerender
server.ts Node SSR entry point + PRERENDERED_ROUTES constant
src/app/app.server.routes.ts Server-side route definitions

Build Scripts

npm run build / npm run build:ssr / npm run build:prerender

npm run build:ssr
# or equivalently
npm run build:prerender
# or
ng build

All three scripts execute ng build (default configuration: production). Because angular.json has both prerender and ssr configured, a single ng build produces:

  1. Browser bundle — client-side JavaScript + CSS under dist/radio-station/browser/
  2. Server bundle — server.mjs + main.server.mjs under dist/radio-station/server/
  3. Prerendered HTML — static HTML files for each route in prerender-routes.txt

npm run serve:ssr:radio-station

node dist/radio-station/server.mjs

Starts the Node SSR server on port 4200. Prerendered routes are served as static HTML; all other routes fall back to SSR or a 404 handler.

Adding a New Prerendered Route

  1. Add the route path (one per line) to prerender-routes.txt
  2. Add the route to PRERENDERED_ROUTES in server.ts
  3. Rebuild: npm run build:ssr

Build Output Structure

dist/radio-station/
├── browser/
│   ├── index.html              <-- prerendered (/)
│   ├── index.csr.html          <-- CSR fallback
│   ├── about/index.html        <-- prerendered (/about)
│   ├── schedule/index.html     <-- prerendered (/schedule)
│   ├── events/index.html       <-- prerendered (/events)
│   ├── contact/index.html      <-- prerendered (/contact)
│   └── ...                     <-- JS/CSS chunks, assets
└── server/
    ├── server.mjs              <-- Node entry point
    ├── main.server.mjs         <-- Angular server bundle
    ├── angular-app-engine-manifest.mjs
    └── ...                     <-- server chunks