109k
新建

2026年3月 - shadcn/cli v4

功能更强大，使用更简单。专为您和您的编码智能体打造。包含技能、预设、干运行（dry run）、新模板、Monorepo 等功能。

我们发布了 shadcn/cli 的第 4 版。功能更强大，使用更简单。专为您和您的编码智能体打造。以下是所有新特性。

shadcn/skills

shadcn/skills 为编码智能体提供了正确使用组件和注册表（registry）所需的上下文。它涵盖了 Radix 和 Base UI 原语、更新的 API、组件模式以及注册表工作流。该技能还了解如何使用 shadcn CLI、何时调用它以及传递哪些标志。智能体将减少错误，并生成真正符合您设计系统的代码。

您可以向您的智能体询问诸如：

  • “创建一个新的 vite monorepo”
  • “帮我从 tailark 找一个 hero 组件，添加到主页，并使用来自 react-bits 的动画来设置文本动画”
  • “安装并配置来自 @clerk 的登录页面”
pnpm dlx skills add shadcn/ui

引入 --preset

预设（preset）将您的整个设计系统配置打包成一段短代码。颜色、主题、图标库、字体、圆角。只需一个字符串，即可包含所有内容。

在 shadcn/create 上构建您的预设，实时预览，并在准备好后获取代码。

pnpm dlx shadcn@latest init --preset a1Dg5eFl

使用它来根据自定义配置搭建项目，与您的团队分享，或发布到您的注册表中。将其放入提示词中，以便您的智能体知道从哪里开始。在 Claude、Codex、v0、Replit 中使用它。随身携带您的预设。

切换预设

当您开发新应用时，可能需要多次尝试才能找到心仪的方案，因此我们使切换预设变得非常简单。在应用中运行 init --preset，CLI 将负责重新配置所有内容，包括您的组件。

pnpm dlx shadcn@latest init --preset ad3qkJ7

技能 + 预设

您的智能体知道如何使用预设。搭建项目、切换设计系统、尝试新方案。

  • “创建一个使用 --preset adtk27v 的新 next 应用”
  • “让我们尝试一下 --preset adtk27v”

全新的 shadcn/create

为了帮助您构建自定义预设，我们重构了 shadcn/create。它现在包含一个 UI 组件库，您可以用来预览预设效果。在开始构建之前，查看您的颜色、字体和圆角如何应用于真实组件。

新增 --dry-run、--diff 和 --view 标志

在写入任何内容之前，检查注册表将向您的项目添加什么内容。您可以自己审查有效载荷，或将其传给您的编码智能体进行二次确认。

pnpm dlx shadcn@latest add button --dry-run
npx shadcn@latest add button --diff
npx shadcn@latest add button --view

更新原语

您可以使用 --diff 标志来检查注册表更新。或者询问您的智能体：“检查 @shadcn 的更新并将其与我的本地更改合并”。

pnpm dlx shadcn@latest add button --diff

shadcn init --template

shadcn init 现在可以为 Next.js、Vite、Laravel、React Router、Astro 和 TanStack Start 搭建完整的项目模板。Next.js 和 Vite 包含深色模式。

pnpm dlx shadcn@latest init

Select a template › - Use arrow-keys. Return to submit.
❯ Next.js
  Vite
  TanStack Start
  React Router
  Astro
  Laravel

使用 --monorepo 来设置一个 monorepo。

pnpm dlx shadcn@latest init -t next --monorepo

shadcn init --base

选择您的原语。使用 --base 来启动一个使用 Radix 或 Base UI 的项目。

pnpm dlx shadcn@latest init --base radix

shadcn info

info 命令现在显示全貌：框架、版本、CSS 变量、已安装的组件，以及在哪里可以找到每个组件的文档和示例。这非常适合为编码智能体提供处理您的项目所需的上下文。

pnpm dlx shadcn@latest info

shadcn docs

直接从 CLI 获取任何 UI 组件的文档、代码和示例。为您的编码智能体提供正确使用您的原语所需的上下文。

pnpm dlx shadcn@latest docs combobox

combobox
  - docs      https://ui.shadcn.org.cn/docs/components/radix/combobox
  - examples  https://raw.githubusercontent.com/shadcn-ui/ui/refs/heads/main/apps/v4/registry/bases/radix/examples/combobox-example.tsx
  - api       https://base-ui.com/react/components/combobox

registry:base 和 registry:font

注册表现在可以使用 registry:base 将整个设计系统作为单个有效载荷分发。组件、依赖项、CSS 变量、字体、配置。只需一次安装，全部设置完毕。

字体现在是一等注册表类型。像安装组件一样安装和配置它们。

font-inter.json
{
  "$schema": "https://ui.shadcn.org.cn/schema/registry-item.json",
  "name": "font-inter",
  "type": "registry:font",
  "font": {
    "family": "'Inter Variable', sans-serif",
    "provider": "google",
    "import": "Inter",
    "variable": "--font-sans",
    "subsets": ["latin"]
  }
}
pnpm dlx shadcn@latest add font-inter

链接