用途:designer-skills 是 LlamaFarm 项目 Designer 子系统的开发技能集,提供框架专属的模式与检查清单。Designer 是一个基于浏览器的项目工作台,用于构建 AI 应用,支持配置编辑、聊天测试、数据集管理、RAG 配置和模型选择。
技术栈:React 18.2(StrictMode)、TypeScript 5.2+、TanStack Query v5、TailwindCSS 3.3、Radix UI 1.x、Vite 6.x、React Router v7、Vitest 1.x、axios 1.x、framer-motion 12.x。
目录结构:designer/src/ 下含 api(axios 服务模块)、assets、components(含 ui 原语)、contexts、hooks(TanStack Query 封装)、lib、types、utils、test。
前置要求:应用前需先符合共享的 TypeScript Skills 与 React Skills。
专属指南:tanstack-query.md(查询/变更、缓存、失效)、tailwind.md(主题、响应式)、radix.md(组件与无障碍)、performance.md(优化、包体积、懒加载)。
关键模式:集中式 axios 客户端含拦截器与错误处理;QueryClient 默认 staleTime 60_000、gcTime 5 分钟、retry 2、指数退避、关闭窗口聚焦重取;cn() 合并 Tailwind 类;ThemeProvider 配合 dark 类策略。组件约定:功能组件按 Feature 目录组织,UI 原语包装 Radix 并用 forwardRef 与 displayName,图标用 lucide-react。测试用 MSW 模拟 API,配合 renderWithProviders。检查清单按 TanStack Query、TailwindCSS、Radix UI、Performance 分类列出关键项。
限制:资料未提供安装命令、版本兼容细节、收费信息及具体使用步骤。