CLI

CLI

CLI는 터미널에서 조각을 찾아 내 프로젝트에 파일로 저장하는 도구예요. 패키지 이름은 vyblor이고, MCP와 같은 API 키로 로그인해요.

로그인

Node 20 이상과 Vyblor 계정이 있으면 돼요. 따로 설치하지 않고 npx로 실행해요.

npx vyblor login

브라우저에서 내 계정이 열려요. API 키를 만들어 터미널에 붙여 넣으면 로그인돼요. 붙여 넣은 키는 화면에 보이지 않고, ~/.config/vyblor/credentials에 나만 읽을 수 있게 저장돼요.

로그인한 계정 보기
npx vyblor whoami
이 기기에서 키 지우기
npx vyblor logout

CI에서는 VYBLOR_API_KEY 환경 변수를 쓰면 돼요.

npx vyblor search button

결과의 왼쪽 값이 slug예요. --type, --kind, --concept로 좁힐 수 있고, 어떤 값이 있는지는 아래 명령으로 볼 수 있어요.

npx vyblor list --taxonomy

가져오기

npx vyblor add minimal-button

기본은 React이고, ./vyblor/minimal-button.jsx로 저장돼요. --format으로 형식을 바꿀 수 있어요. html은 .html, prompt는 .prompt.md 파일이 돼요.

HTML로 가져오기
npx vyblor add minimal-button --format html
내 브랜드 값으로 가져오기
npx vyblor add minimal-button --radius 12px --accent '#54386b'

add가 지키는 것

  • 서버가 보낸 내용을 그대로 저장하고, 다른 일은 하지 않아요.
  • --force를 붙이지 않으면 있는 파일을 덮어쓰지 않아요.
  • 프로젝트 밖으로 나가는 경로는 거절해요. 심볼릭 링크를 거쳐도 마찬가지예요. --out으로 경로를 직접 적으면 그곳에 써요.
  • GSAP 같은 라이브러리가 필요한 조각은 설치 명령과 라이선스 링크를 알려 줘요.

한도와 종료 코드

한도는 MCP와 같이 세요. 한도에 닿으면 언제 다시 하면 되는지 알려 줘요.

0
끝났어요
2
명령이나 옵션이 잘못됐어요
3
로그인이 필요해요
4
한도에 닿았어요
5
조각을 찾지 못했어요
6
네트워크 문제예요
7
파일을 쓰지 않았어요
8
서버 문제예요

직접 복사해 주세요

브라우저가 복사를 막았어요. 아래 글을 선택해서 복사해 주세요.