react-vite-guide
CommunityReact 19 + Vite SPA best-practice guide
AuthorbuYoung
Version1.0.0
Installs0
System Documentation
What problem does it solve?
This guide helps AI agents consistently apply modern React 19 + Vite SPA best practices, spanning architecture, performance, accessibility, and project configuration to reduce rework and accelerate delivery.
Core Features & Use Cases
- Patterns for component composition (compound components, state lifting) and provider-based state management.
- Performance optimizations (React.lazy, Suspense, code-splitting, useMemo, useCallback) and Vite-specific config (manualChunks, env vars, path aliases).
- Accessibility and web UI best practices (ARIA, forms, dark mode) with practical scenarios like dashboards, editors, and marketing sites.
Quick Start
Observe an existing React + Vite project and apply these patterns to refactor core components, optimize bundles, and improve accessibility.
Dependency Matrix
Required Modules
None requiredComponents
references
💻 Claude Code Installation
Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.
Please help me install this Skill: Name: react-vite-guide Download link: https://github.com/buYoung/skills/archive/main.zip#react-vite-guide Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
Agent Skills Search Helper
Install a tiny helper to your Agent, search and equip skill from 510,000+ vetted skills library on demand.