用途：该技能面向使用 React + Vite 构建应用的场景，提供从项目架构到生产配置的系统性指导，帮助组织可维护、可扩展的 React 项目。
主要能力：
- 项目架构与组织：参考 references/project_architecture.md，涵盖基于功能、原子设计、领域驱动等文件夹结构，命名与导入策略（路径别名、barrel 导出、tree-shaking），状态放置与扩展指南。
- 代码生成：scripts/create_component.py 生成组件所需文件（.tsx、.types.ts、.module.css、测试、可选 Storybook story、index）；scripts/create_hook.py 生成自定义 Hook（状态、Effect、数据获取、localStorage、防抖、定时器等）。
- 性能优化：参考 references/performance_optimization.md，涵盖 React.memo、useMemo、useCallback、React.lazy 代码分割、react-window 虚拟列表、防抖节流、Vite 构建优化、图片优化与 Web Vitals；scripts/analyze_bundle.py 分析依赖与导入模式并给出建议。
- 生产配置：assets/vite.config.optimized.ts（路径别名、手动分包、Terser 去除 console.log、bundle 分析、开发代理、条件 source map、CSS 拆分）；assets/tsconfig.optimized.json（strict、路径别名、未使用检测）；assets/package.json.example（脚本、依赖、Husky 与 lint-staged、CI/CD）；assets/project-structure-example.md 提供目录树与示例。
- 最佳实践：参考 references/best_practices.md，涵盖复合组件、render props、HOC、自定义 Hook、错误边界、表单、测试、无障碍与常见反模式；TypeScript 类型模式；测试策略（React Testing Library、Hook 测试、Mocking、集成测试）；状态管理决策树（TanStack Query、useState、提升状态、Context、Zustand、Redux Toolkit）。
使用方式：按需阅读对应 references 文档，运行脚本生成代码，复制 assets 中的配置与示例到项目。
限制：资料未提供具体收费、版本兼容性、支持平台、依赖版本细节与实际效果数据，均暂未提供。