Skills
opt-ui 설치, 환경 진단, 컴포넌트 생성, repo 동기화, release 워크플로우를 정리합니다.
reopt designUpdated
1. 두 종류의 Skills
opt 디자인 시스템에는 실행 위치와 소유 저장소가 다른 두 종류의 스킬이 있습니다. 소비자 프로젝트용 설치·업그레이드 스킬의 단일 기준은
reopt-ai/reopt-skills이고, 이 모노레포의 컴포넌트 제작·검토·배포 스킬은
packages/opt-ui-skills가 소유합니다.
Consumer skills: 실제 앱에서 패키지를 설치·업그레이드하고 프로젝트 설정과 검증을 수행합니다.
Maintainer skills: reopt-design 안에서 컴포넌트 생성, 가이드 검토, E2E, 문서 예제, 배포 작업을 수행합니다.
2. 소비자 스킬 설치
소비자 프로젝트 루트에서 skills CLI로 설치합니다. Claude Code,
Cursor, Codex, Cline, Gemini CLI 등 skills.sh 호환 런타임에서 같은 명령을
사용합니다.
# opt-ui 전용 스킬만 설치
npx skills add reopt-ai/reopt-skills/opt-ui-install
# reopt 스킬 전체 설치
npx skills add reopt-ai/reopt-skills설치 후 에이전트에게
opt-ui-install 스킬로 이 프로젝트에 @reopt-ai/opt-ui를 설정하고
검증해줘
라고 요청합니다. 설치 여부를 감지해 신규 설치와 업그레이드를 자동 구분합니다.
3. 현재 소비자 스킬
| Skill | 대상 | 지원 범위 |
|---|---|---|
opt-ui-install | @reopt-ai/opt-ui | 설치·업그레이드, Tailwind v4, theme provider, doctor, Surface |
opt-datagrid-install | @reopt-ai/opt-datagrid | 설치·업그레이드, 타 grid 마이그레이션, 검증 |
opt-editor-install | @reopt-ai/opt-editor | 설치·업그레이드, 필수 CSS, Editor, 선택적 AI 스트리밍 |
opt-chat-install | @reopt-ai/opt-chat | 설치·업그레이드, 스타일, AI SDK endpoint, Conversation |
opt-shell-install | @reopt-ai/opt-shell | 구 opt-harness 전환, peer, recipe, policy, adapter |
brandapp-sdk-install | @reopt-ai/brandapp-sdk | 공개 npm 전환, 환경 변수, SDK·auth·EAV 기반 |
4. v2 스킬이 프로젝트에 남기는 것
소비자 프로젝트의
AGENTS.md에 reopt marker 블록을 기록합니다. 파일이 없을 때만CLAUDE.md를 사용하며 두 파일을 동시에 수정하지 않습니다.재실행할 때 marker 내부만 교체하므로 프로젝트 고유 지침은 보존되고 중복 블록이 생기지 않습니다.
API를 스킬 안에 복제하지 않고 설치된 패키지 버전의
dist/docs/,README.md또는shell-llms.txt를 읽습니다.레거시 registry override, peer dependency, CSS, provider, doctor, typecheck처럼 소비자 프로젝트에서만 결정할 수 있는 설정을 처리합니다.
5. 전용 설치 스킬이 없는 모듈
| 모듈 | 현재 안내 |
|---|---|
opt-charts |
|
opt-calendar | Shell 통합 시 |
opt-cli |
|
opt-devtool | 전용 스킬 없음. 개발 의존성·production guard·bridge를 수동 연결 |
opt-ui-primitives | 대부분 |
opt-palette |
|
공통 기반 스킬은 해당 패키지를 설치한다고 보장하지 않습니다. 각 모듈의 시작하기에는 자동 처리 범위와 수동 단계가 분리되어 있습니다.
6. reopt-design 메인테이너 스킬
| Skill | 용도 |
|---|---|
opt-ui-create | Core·Shell 컴포넌트 scaffold |
opt-ui-guide | 레이어·토큰·접근성 가이드 검토 |
opt-e2e-loop | 문서 데모와 컴포넌트 E2E 루프 |
opt-datagrid-backend | 원격 DataGrid backend 계약 설계·검토 |
explore-example-create | 새 explore 예제 생성 |
explore-example-review | explore 예제 품질 검토 |
design-publish | 디자인 패키지 배포 preflight와 release |
이 스킬들은 소비자 앱에 설치하는 스킬이 아니며 reopt-design 저장소에서만
실행합니다. consumer-facing 스킬을 packages/opt-ui-skills에
복제하거나 유지보수하지 않습니다.
7. 적용 후 확인
- 스킬은 반드시 실제 소비자 프로젝트 루트에서 실행합니다.
marker 블록이 하나만 존재하고 프로젝트 고유 지침이 보존됐는지 확인합니다.
스킬이 안내한 패키지 문서 경로가 설치된 버전에 실제로 존재하는지 확인합니다.
- typecheck와 모듈별 doctor·smoke 검증이 통과해야 완료로 봅니다.
스킬의 최신 지원 버전은 reopt-skills의
COMPATIBILITY.md를 기준으로 확인합니다.