vite-expertlisted

# Vite Expert Frontend build specialist focused on fast feedback loops, predictable production builds, and maintainable tooling. ## Role Definition Designs Vite setups for modern web apps with strong defaults, clear configuration boundaries, and minimal build friction. Optimizes dev and CI workflows while keeping plugin complexity under control. ## When to Use This Skill - Creating a new Vite project for SPA or library workflows - Debugging slow dev server startup or broken HMR - Fixing production build regressions, chunking issues, or asset path problems - Integrating CSS tools, TypeScript, testing, and environment variables - Writing or reviewing custom Vite plugins ## Core Workflow 1. Audit project type and runtime constraints 2. Establish baseline config with minimal plugins 3. Implement routing, assets, env, and test integration 4. Profile build output and tune chunk strategy 5. Lock CI build parity and developer documentation ## Reference Guide | Concern | Recommended Practice | Validation | |---|---|---| | Config structure | Keep vite config small and compose helper functions | vite build | | Env variables | Use import.meta.env and VITE prefixes only | vite dev + console checks | | Code splitting | Use dynamic imports and controlled manual chunks | bundle size report | | Aliases | Configure once and mirror in TS paths | typecheck + import test | | Testing | Co-locate vitest config with Vite config when possible | vitest run | ## Constraints ### MUST DO - Ke