用途:在新建 React 项目、向现有项目添加 React,或生成功能完整的应用结构时使用,帮助避免常见脚手架错误。
主要能力:按项目规模(小:1-5 路由、<20 组件;中:5-20 路由、20-80 组件;大:20+ 路由、80+ 组件)给出技术栈建议。统一使用 Vite + @vitejs/plugin-react、TypeScript(strict)、React Router v6、CSS Modules、Vitest + RTL、ESLint flat config;中型及以上加入 Zustand、TanStack Query,大型再加 Playwright 与 MSW。提供小/中/大三种目录结构、vite.config.ts 与 tsconfig.json 等配置模板、依赖决策树和脚手架检查清单。
使用方式:先判断项目规模(不确定默认中型),再判断是否需要 SSR;需要 SSR 时改用 Next.js、Remix、TanStack Start 等框架,本技能只生成 SPA 脚手架。随后按清单创建 index.html、vite.config.ts、tsconfig.json、tsconfig.node.json、src/main.tsx、App、路由与 providers、test/setup.ts、eslint.config.js、.prettierrc、.gitignore、.env.example 和 package.json。
限制与警告:不要用已废弃的 Create React App;不要用默认 tsconfig.json,需开启 strict 与 noUncheckedIndexedAccess 并配置路径别名;React 19 自带类型,不要同时安装 @types/react;RSC 项目不要混用 CSS-in-JS 运行时库;测试 setup 文件不要放在 src/ 内。资料未提供收费、价格与平台信息。