CLI

CLI

shadcn CLI는 프로젝트에 컴포넌트를 추가하는 데 사용하는 명령줄 도구예요. 컴포넌트를 한 번에 추가하고, 의존성을 자동으로 설치하며, 프로젝트 설정에 맞게 import 경로와 Tailwind 설정을 손봐 줘요. 처음 프로젝트를 초기화하는 init부터 컴포넌트를 추가하는 add, 레지스트리를 만드는 build까지 다양한 명령어를 제공해요.

출처: 문서

본문

참고: 방금 새로운 shadcn CLI를 릴리스했어요. 자세한 내용은 변경 사항을 참고해 주세요.

init

init 명령어는 새 프로젝트의 설정과 의존성을 초기화하는 데 사용해요.

init 명령어는 의존성을 설치하고, cn 유틸을 추가하며, tailwind.config.js와 프로젝트용 CSS 변수를 구성해 줍니다.

npx shadcn@latest init

components.json을 구성하기 위해 몇 가지 질문을 받게 됩니다:

Which style would you like to use? › New York
Which color would you like to use as base color? › Zinc
Do you want to use CSS variables for colors? › no / yes

옵션 (Options)

Usage: shadcn init [options] [components...]

initialize your project and install dependencies

Arguments:
  components         the components to add or a url to the component.

Options:
  -d, --defaults    use default values i.e new-york, zinc and css variables. (default: false)
  -f, --force       force overwrite of existing components.json. (default: false)
  -y, --yes         skip confirmation prompt. (default: false)
  -c, --cwd <cwd>   the working directory. defaults to the current directory.
  -h, --help       display help for command

add

add 명령어는 프로젝트에 컴포넌트와 의존성을 추가하는 데 사용해요.

npx shadcn@latest add [component]

추가할 컴포넌트 목록이 표시됩니다:

Which components would you like to add? › Space to select. A to toggle all.
Enter to submit.

◯  accordion
◯  alert
◯  alert-dialog
◯  aspect-ratio
◯  avatar
◯  badge
◯  button
◯  calendar
◯  card
◯  checkbox

옵션 (Options)

Usage: shadcn add [options] [components...]

add a component to your project

Arguments:
  components         the components to add or a url to the 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.
  -h, --help         display help for command

build

build 명령어는 레지스트리 JSON 파일을 생성하는 데 사용해요.

npx 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. (default:
                       "/Users/shadcn/Code/shadcn/ui/packages/shadcn")
  -h, --help           display help for command

출력 디렉터리를 바꾸고 싶다면 --output 옵션을 사용하면 돼요.

npx shadcn@latest build --output ./public/registry

더 알아보기 (Learn more)