SuperAPI AI 工具集

react-scaffold

前端与建站

查看项目

更新于 10-15 21:37

技能介绍

用途:React 项目脚手架技能,可新建 React 项目,也可为已有项目自动补齐缺失配置。

工作流程:先检测项目状态,包括是否为空目录、是否 Vite(vite.config.ts/js)、是否 Next.js(next.config.ts/js/mjs)、是否 TypeScript(tsconfig.json 或 tsconfig.app.json)、是否含 @tanstack/react-query、tailwindcss、eslint.config.js/mjs、.prettierrc、.vscode/settings.json,并根据 lock 文件判断包管理器(pnpm-lock.yaml→pnpm,yarn.lock→yarn,bun.lockb/bun.lock→bun,package-lock.json 或无→npm)。

随后分支处理:空目录进入脚手架模式,询问项目类型 Vite(CSR) 还是 Next.js(SSR),执行创建命令;已有项目进入补全模式,仅识别并自动生成缺失配置,不覆盖已有配置文件。框架配置分别读取 references/vite.md 或 references/nextjs.md。

通用配置:缺失时生成 .prettierrc 与 .vscode/settings.json;缺失时用检测到的包管理器安装 @tanstack/react-query 和 -D @tanstack/eslint-plugin-query,向 ESLint Flat Config 加入 tanstackQuery.configs.recommended,并在 Vite 的 src/App.tsx 或以 'use client' 的 Next.js src/app/providers.tsx 中包裹 QueryClientProvider。

限制:不覆盖已有配置文件;仅脚手架模式询问项目类型,补全模式静默进行;空目录使用 npm。资料未说明收费、价格与效果。