组件
初始化
使用 init
命令初始化新项目的配置和依赖项。
init
命令会安装依赖项,添加 cn
工具并为项目配置 CSS 变量。
pnpm dlx shadcn@latest init
选项
Usage: shadcn init [options] [components...]
initialize your project and install dependencies
Arguments:
components name, url or local path to component
Options:
-t, --template <template> the template to use. (next, next-monorepo)
-b, --base-color <base-color> the base color to use. (neutral, gray, zinc, stone, slate)
-y, --yes skip confirmation prompt. (default: true)
-f, --force force overwrite of existing configuration. (default: false)
-c, --cwd <cwd> the working directory. defaults to the current directory.
-s, --silent mute output. (default: false)
--src-dir use the src directory when creating a new project. (default: false)
--no-src-dir do not use the src directory when creating a new project.
--css-variables use css variables for theming. (default: true)
--no-css-variables do not use css variables for theming.
--no-base-style do not install the base shadcn style
-h, --help display help for command
添加
使用 add
命令将组件和依赖项添加到您的项目。
pnpm dlx shadcn@latest add [component]
选项
Usage: shadcn add [options] [components...]
add a component to your project
Arguments:
components name, url or local path to component
Options:
-y, --yes skip confirmation prompt. (default: false)
-o, --overwrite overwrite existing files. (default: false)
-c, --cwd <cwd> the working directory. defaults to the current directory.
-a, --all add all available components (default: false)
-p, --path <path> the path to add the component to.
-s, --silent mute output. (default: false)
--src-dir use the src directory when creating a new project. (default: false)
--no-src-dir do not use the src directory when creating a new project.
--css-variables use css variables for theming. (default: true)
--no-css-variables do not use css variables for theming.
-h, --help display help for command
查看
使用 view
命令在安装之前查看注册表中的项。
pnpm dlx shadcn@latest view [item]
您可以一次查看多个项
pnpm dlx shadcn@latest view button card dialog
或者查看来自命名空间注册表中的项
pnpm dlx shadcn@latest view @acme/auth @v0/dashboard
选项
Usage: shadcn view [options] <items...>
view items from the registry
Arguments:
items the item names or URLs to view
Options:
-c, --cwd <cwd> the working directory. defaults to the current directory.
-h, --help display help for command
搜索
使用 search
命令从注册表中搜索项。
pnpm dlx shadcn@latest search [registry]
您可以带查询词搜索
pnpm dlx shadcn@latest search @shadcn -q "button"
或者一次搜索多个注册表
pnpm dlx shadcn@latest search @shadcn @v0 @acme
list
命令是 search
的别名
pnpm dlx shadcn@latest list @acme
选项
Usage: shadcn search|list [options] <registries...>
search items from registries
Arguments:
registries the registry names or urls to search items from. Names
must be prefixed with @.
Options:
-c, --cwd <cwd> the working directory. defaults to the current directory.
-q, --query <query> query string
-l, --limit <number> maximum number of items to display per registry (default: "100")
-o, --offset <number> number of items to skip (default: "0")
-h, --help display help for command
列表
使用 list
命令列出注册表中的所有项。
pnpm dlx shadcn@latest list @acme
选项
Usage: shadcn list [options] <registries...>
list items from registries
Arguments:
registries the registry names or urls to list items from. Names
must be prefixed with @.
选项
Usage: shadcn list [options] <registries...>
list items from registries
Arguments:
registries the registry names or urls to list items from. Names
must be prefixed with @.
构建
使用 build
命令生成注册表 JSON 文件。
pnpm dlx shadcn@latest build
此命令读取 registry.json
文件并在 public/r
目录中生成注册表 JSON 文件。
选项
Usage: shadcn build [options] [registry]
build components for a shadcn registry
Arguments:
registry path to registry.json file (default: "./registry.json")
Options:
-o, --output <path> destination directory for json files (default: "./public/r")
-c, --cwd <cwd> the working directory. defaults to the current directory.
-h, --help display help for command
要自定义输出目录,请使用 --output
选项。
pnpm dlx shadcn@latest build --output ./public/registry