Agent Skills
› trycompai/crm
trycompai/crm
GitHub提供构建AI聊天界面的组件库，支持对话、消息等UI元素。适用于开发聊天机器人或AI助手前端界面，集成于Next.js项目。
安装全部 Skills
npx skills add trycompai/crm --all -g -y
集合内 Skills (33)
提供构建AI聊天界面的组件库，支持对话、消息等UI元素。适用于开发聊天机器人或AI助手前端界面，集成于Next.js项目。
用户希望构建聊天机器人界面
需要添加AI助手UI功能
npx skills add trycompai/crm --skill ai-elements -g -y
提供 Better Auth 的全栈集成指南，涵盖安装、环境变量配置、数据库适配器设置（支持 Prisma/Drizzle）、会话管理及插件扩展。适用于需要快速搭建 TypeScript 身份认证系统的开发场景。
Better Auth 集成配置
Better Auth 数据库适配器设置
Better Auth 会话管理
Better Auth 插件配置
Better Auth 环境变量的设置
npx skills add trycompai/crm --skill better-auth-best-practices -g -y
提供OKLCH色彩空间在Web项目中的应用，支持颜色转换、调色板生成、对比度检查及Tailwind v4主题集成。
oklch转换
调色板生成
对比度检查
gamut边界处理
Tailwind v4主题
npx skills add trycompai/crm --skill better-colors -g -y
协调多个专项技能对界面进行整体审查，整合无障碍、布局、文案等维度的发现，输出统一优先级结论。
better-interface
full interface review
holistic UI audit
cross-discipline design review
npx skills add trycompai/crm --skill better-interface -g -y
提供UI细节打磨的设计工程原则，涵盖动画、图标、阴影等视觉优化，用于构建或审查前端组件以提升界面精致度。
UI polish
design details
make it feel better
feels off
stagger animations
border radius
optical alignment
image outlines
box shadows
icons
icon stroke weight
icon states
motion restraint
npx skills add trycompai/crm --skill better-ui -g -y
专注于UX写作和界面文案的Skill，涵盖按钮、错误提示等用户可见文本的撰写与审查，强调简洁一致、语气适配及无障碍原则。
UX写作
微文案
界面文案
产品文案
按钮标签
链接文本
错误消息
空状态
占位符文本
设置标签
大小写规范
npx skills add trycompai/crm --skill better-writing -g -y
深度审查代码变更，检查复用性、组合合理性、代码库一致性并检测冗余代码。适用于PR审查、代码清理及架构优化场景。
审查PR或Diff
检查代码复用与组合
评估代码整洁度与一致性
npx skills add trycompai/crm --skill code-refactor-review -g -y
自动执行代码提交、推送并创建草稿PR。通过git命令分析变更，遵循特定分支命名规范，利用pr-description技能生成结构化描述，并在必要时包含UX流程说明，最终使用gh cli创建草稿PR。
完成代码修改后需要创建Pull Request
需要将本地更改推送到远程仓库并建立PR
npx skills add trycompai/crm --skill create-draft-pr -g -y
用于构建基于eve框架的持久化后端AI智能体。支持创建、编辑和调试智能体项目，涵盖指令、技能、工具、连接及调度等配置文件的处理。
使用eve框架构建后端AI智能体
初始化或脚手架生成eve项目
调试或编辑eve智能体的配置文件
npx skills add trycompai/crm --skill eve -g -y
用于在后台并行会话中启动针对现有PR或分支的后续开发任务，支持地址解析、复用环境及合并冲突解决。
用户要求处理现有PR
继续特定分支工作
解决PR反馈
解决合并冲突
npx skills add trycompai/crm --skill ga-pr -g -y
自动化启动新开发任务，根据描述生成分支名并创建并行工作区。通过构建提示词调用Pi或Claude执行开发，最终报告会话信息以便用户连接。
需要开启新功能或修复bug
请求在独立环境中进行并行开发
npx skills add trycompai/crm --skill ga -g -y
提供NestJS生产级应用的架构模式与最佳实践，涵盖模块设计、依赖注入、安全及性能优化。用于编写、审查或重构NestJS代码，确保遵循规范并提升质量。
编写新的NestJS模块或服务
审查代码以检查架构和安全问题
重构现有NestJS代码库
npx skills add trycompai/crm --skill nestjs-best-practices -g -y
禁止在React中直接使用useEffect，提供五种替代模式（派生状态、数据获取库、事件处理、挂载同步、重置状态），用于编写、重构或审查React组件代码。
编写新的React组件
重构现有的useEffect调用
审查引入useEffect的PR
Agent意外添加useEffect时
npx skills add trycompai/crm --skill no-use-effect -g -y
提供nuqs库在Next.js和React中类型安全URL查询状态管理的最佳实践。涵盖解析器配置、适配器设置、状态管理、服务端集成及性能优化等规则，用于指导代码生成、重构与审查。
使用nuqs进行URL状态管理
配置URL参数解析器
集成Server Components
优化URL更新性能
npx skills add trycompai/crm --skill nuqs -g -y
优化 API、Hook 或组件设计，通过重构使正确用法成为默认路径，消除潜在的使用陷阱（Footguns），确保代码的鲁棒性和易用性。
API 设计存在易错点
需要消除使用陷阱
重构公共接口
npx skills add trycompai/crm --skill pit-of-success -g -y
辅助用户在代码中自动集成PostHog分析、事件追踪及功能标志。支持识别框架并添加相应埋点代码，遵循最佳实践确保数据一致性。
用户要求添加PostHog或分析功能
需要追踪事件或用户行为
需要实现功能标志
npx skills add trycompai/crm --skill posthog-instrumentation -g -y
分析当前分支相对于main的变更及PR信息，构建上下文以便后续任务。通过git和gh命令获取diff、日志和PR详情，总结代码改动、影响范围及评审意见，为开发者提供全面背景。
prepare context
branch context
catch me up
what's on this branch
npx skills add trycompai/crm --skill prepare-branch-context -g -y
提供 Prisma ORM 配置指南，涵盖 PostgreSQL、MySQL、MongoDB 等数据库的初始化、连接配置及驱动适配。用于新项目搭建、切换数据库或排查连接问题。
configure postgres
connect to mysql
setup mongodb
sqlite setup
npx skills add trycompai/crm --skill prisma-database-setup -g -y
管理 shadcn/ui 组件与项目，支持添加、搜索、调试及样式调整。提供上下文、文档与示例，遵循组合优先原则，规范 Tailwind 样式与表单结构，确保 UI 一致性。
使用 shadcn CLI 添加或搜索组件
初始化 shadcn 项目或切换预设
处理包含 components.json 的项目
修复或定制 shadcn 组件样式
npx skills add trycompai/crm --skill shadcn -g -y
用于创建新技能、修改优化现有技能及评估性能。支持从零起草、迭代改进、运行评测基准分析及优化触发描述，帮助用户完成技能的定义、测试与调优全流程。
用户希望从头创建一个新的技能
用户需要编辑或优化现有技能的性能和描述
npx skills add trycompai/crm --skill skill-creator -g -y
提供Turborepo单体仓库构建系统的最佳实践，指导任务配置、缓存优化及CI集成，强调使用包级任务以支持并行执行。
配置turbo.json任务管道
调试构建缓存失效问题
优化CI/CD流水线中的monorepo构建效率
npx skills add trycompai/crm --skill turborepo -g -y
提供TypeScript高级类型系统指南，涵盖泛型、条件类型、映射类型及工具类型，用于构建类型安全应用、复杂类型逻辑及可复用组件。
实现复杂的类型推断逻辑
创建可复用的泛型组件或工具类型
确保编译时类型安全
迁移JavaScript代码库到TypeScript
npx skills add trycompai/crm --skill typescript-advanced-types -g -y
创建以用户体验为核心的架构规划，先构建用户流程树，再映射代码锚点。明确架构边界决策，区分当前与期望状态，辅助开发前理清逻辑与实现细节。
需要制定功能架构方案
梳理复杂业务的用户交互流程
在编码前进行系统设计
npx skills add trycompai/crm --skill ux-flow-plan -g -y
提供React组件组合模式指南，用于重构布尔属性泛滥、构建可复用库及设计灵活API。涵盖复合组件、渲染属性和上下文提供者等架构最佳实践，并包含React 19新API规范。
重构包含大量布尔属性的组件
构建可复用的组件库
审查组件架构设计
使用复合组件或上下文提供者
npx skills add trycompai/crm --skill vercel-composition-patterns -g -y
提供React和Next.js性能优化指南，涵盖消除数据瀑布流、包体积优化及服务端渲染等规则。适用于编写、审查或重构代码时确保最佳性能实践。
编写新的React组件或Next.js页面
审查代码以发现性能问题
重构现有React/Next.js代码
优化包体积或加载速度
npx skills add trycompai/crm --skill vercel-react-best-practices -g -y
审查UI代码是否符合Web界面指南，支持访问性、UX及最佳实践审计。通过Fetch获取最新规则，检查指定文件并输出问题位置。
review my UI
check accessibility
audit design
review UX
check my site against best practices
npx skills add trycompai/crm --skill web-design-guidelines -g -y
指导如何重构代码以消除技术债务，从最终目标状态出发删除兼容性和冗余复杂度，优化组件结构和共享规则。
重构遗留代码
清理技术债务
简化复杂逻辑
npx skills add trycompai/crm --skill zero-tech-debt -g -y
解答 Vercel AI SDK 相关问题并辅助构建 AI 功能，涵盖模型调用、流式处理、工具调用及 React 钩子等。强调必须依据本地安装版本的文档和源码进行开发，严禁依赖记忆编写代码。
AI SDK
Vercel AI SDK
generateText
streamText
add AI to my app
build an agent
tool calling
structured output
useChat
npx skills add trycompai/crm --skill ai-sdk -g -y
专注于前端界面无障碍工程，涵盖键盘导航、ARIA语义、屏幕阅读器支持及焦点管理。用于构建或审查UI组件，确保符合WCAG标准，提升可访问性体验。
用户要求使界面无障碍或修复键盘/读屏问题
涉及focus states, ARIA, keyboard navigation, WCAG等关键词
npx skills add trycompai/crm --skill better-accessibility -g -y
用于指导 Web 界面布局结构设计的技能，涵盖分组、对齐、间距、响应式断点及 RTL 支持。适用于页面或组件的结构化构建、控制元素排列及前端代码审查。
Web 界面布局结构设计
UI 组件间距与对齐调整
响应式断点与适配处理
前端代码布局审查
npx skills add trycompai/crm --skill better-layout -g -y
专注Web排版优化，涵盖字体选择、变量字体、字阶设置、文本换行及可访问性检查。指导前端代码审查与样式实现，确保文本渲染质量与一致性。
需要选择或搭配字体时
配置变量字体或OpenType特性时
检查标题层级和文本间距时
审查前端组件文本样式时
npx skills add trycompai/crm --skill better-typography -g -y
指导在NestJS中使用nestjs-trpc构建端到端类型安全API，涵盖模块配置、装饰器使用及客户端类型生成。
提及 nestjs-trpc 或 tRPC in NestJS
使用 @Router/@Query 等装饰器
迁移 GraphQL/REST 到 tRPC
生成 AppRouter 类型
npx skills add trycompai/crm --skill nestjs-trpc -g -y
用于诊断和审查网站SEO问题，提供技术、内容和架构方面的优化建议。
用户请求SEO审计或诊断
询问排名下降或流量问题
提及技术SEO、索引错误或核心网页指标
npx skills add trycompai/crm --skill seo-audit -g -y
