scaffold-frontend

To scaffold a Vite + React + TypeScript frontend, use canonical templates that wire ESLint, Vitest, ArchUnitTS, and Tailwind together. This provides a standardized baseline by copying template files rather than improvising, ensuring reproducible builds with pinned dependency versions.

Normalizing an existing React project involves applying a canonical Vite + TypeScript template to standardize configurations. The skill aligns ESLint, Vitest, and TypeScript configs across the team, using the templates directory as the single source of truth for consistent tooling.

Yes, scaffolding with this template wires architecture tests via ArchUnitTS alongside Vitest. It establishes automated checks for architecture and tooling alignment during project bootstrap, ensuring structural code rules are enforced consistently across the frontend application.

Yes, the scaffolding pins dependencies to known-good versions to ensure reproducible setups. By specifying canonical templates as the source of truth, it prevents version drift and guarantees that the Vite, React, and TypeScript stack remains stable.

You need a canonical template when manual frontend scaffolding becomes repetitive or when enforcing a standard stack across teams. It solves configuration inconsistencies by providing a template-driven bootstrap for new SPA or admin UI projects.

Copying Vite and React configs from another repo introduces errors and non-standard configurations. The limitation is that manual setups lack pinned dependency versions and canonical ArchUnitTS wiring, leading to inconsistent tooling baselines and potential architecture misalignment.