SlpSoftware/aidlc-docs/features/react-frontend/construction/build-and-test/build-instructions.md

Build Instructions

Prerequisites

• Build Tool: Vite 5 + TypeScript (project references / tsc -b)
• Package Manager: pnpm
• Runtime: Node.js (LTS compatible with Vite 5 / TypeScript 5.6)
• Dependencies: All packages listed in package.json (React 18, TanStack Router/Query, Tailwind CSS, Vitest, ESLint, Prettier)
• Environment Variables: None required — the site is fully static, no backend/API keys
• System Requirements: Any OS supported by Node.js; no special memory/disk requirements (small static bundle)

Build Steps

1. Install Dependencies

pnpm install

2. Configure Environment

No environment configuration is required. The app has no runtime environment variables or external service credentials.

3. Build the Unit (react-frontend-app)

pnpm run build

This runs tsc -b (type-check via project references) followed by vite build (production bundle).

4. Verify Build Success

• Expected Output: tsc -b completes with no type errors; vite build reports the generated chunks and finishes with ✓ built in <time>
• Build Artifacts: Static assets emitted to dist/ (HTML, JS, CSS, fonts) — ready to be uploaded as-is to any static/FTP web host
• Common Warnings: None expected under normal conditions

Troubleshooting

Build Fails with Dependency Errors

• Cause: node_modules missing/corrupted, or pnpm-lock.yaml out of sync with package.json
• Solution: Delete node_modules, re-run pnpm install; if the lockfile is out of date, run pnpm install again to regenerate it, then rebuild

Build Fails with Compilation Errors

• Cause: TypeScript type errors introduced by recent changes (e.g. incorrect props, missing imports)
• Solution: Read the tsc -b error output (file + line), fix the reported type issue, and re-run pnpm run build

Verified Result (this session)

• pnpm run build executed successfully: tsc -b && vite build completed without errors, dist/ was generated correctly.