Tech Stack

mpa-template overview

Multi-page, prerendered SvelteKit 5 starter with UnoCSS, TypeScript, Vitest, Playwright, and Taskfile-driven workflows.

Back to samples Process playbook Repository

Core runtime

  • SvelteKit 5 MPA with prerender + CSR hydration.
  • TypeScript strict configured via `tsconfig.typecheck.json` for app-only checks.
  • Vite build with UnoCSS and devtools-json plugin.
  • Adapter-static for static export.

Styling

  • UnoCSS with wind-4 preset and extractor for Svelte.
  • Tailwind reset via `@unocss/reset/tailwind.css`.
  • Space Grotesk font for headings and body.

Testing

  • Vitest for unit tests (`task test:unit`).
  • Playwright for E2E in `e2e/` (`task test:e2e`).
  • Type checks via `task typecheck` (app-only scope).

Tooling

  • Taskfile for scripted workflows (`task dev`, `task build`).
  • Corepack + Yarn 4 using the `node_modules` linker.
  • ESLint + Prettier configured for Svelte and TS.

MPA routing

Each page is a prerendered route; add new pages under `src/routes/*/+page.svelte`.

Styling approach

Utility-first classes with scoped exceptions; document non-obvious class clusters.

Testing flow

Unit first (`task test:unit`), then E2E (`task test:e2e`) against a running preview.