SuperAPI AI 工具集

shadcn

测试与质量

查看项目

更新于 10-16 06:48

技能介绍

用途:shadcn/ui 是构建 UI、组件与设计系统的框架,组件以源码形式通过 CLI 加入用户项目。本技能用于管理 shadcn 组件与项目,涵盖添加、搜索、修复、调试、样式与组合 UI,并提供项目上下文与组件文档。

主要能力:通过 CLI 获取项目配置与已安装组件信息(npx shadcn@latest info --json),搜索注册表(npx shadcn@latest search),获取组件文档与示例 URL(npx shadcn@latest docs <component>),添加组件(npx shadcn@latest add),预览变更(--dry-run、--diff),以及预设的解析、解码、应用(preset resolve/decode/url/open、apply、init --preset)。

使用方式:所有 CLI 命令须使用项目对应的包运行器:npx shadcn@latest、pnpm dlx shadcn@latest 或 bunx --bun shadcn@latest。先读取注入的项目上下文(aliases、isRSC、tailwindVersion、base、iconLibrary、resolvedPaths、framework、packageManager、preset 等),再检查已安装组件,查找并获取文档,最后安装或更新。更新组件时用 --dry-run 与 --diff 智能合并,未经用户明确同意不得使用 --overwrite。

适用场景:在 React/Next.js 等项目中构建界面、表单、导航、覆盖层、反馈、图表、空状态与菜单等,优先复用已有组件与内置变体,使用语义化颜色与 cn()。

限制:资料未提供收费、价格、平台或效果信息;具体组件 API 与可用属性取决于 base(radix 或 base)与项目配置,需以 CLI 获取的文档为准。