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
- 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
78 lines
3.2 KiB
Markdown
78 lines
3.2 KiB
Markdown
# 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`
|
|
|
|
```bash
|
|
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`
|
|
|
|
```bash
|
|
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
|
|
```
|