@su-record/vibe 2.8.5 → 2.8.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/commands/vibe.figma.md +38 -3
- package/package.json +1 -1
package/commands/vibe.figma.md
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
---
|
|
2
2
|
description: Figma design to code — extract + generate in one step
|
|
3
|
-
argument-hint: "figma-url" ["figma-url-2"] [--new]
|
|
3
|
+
argument-hint: "figma-url" ["figma-url-2"] [--new]
|
|
4
4
|
---
|
|
5
5
|
|
|
6
6
|
# /vibe.figma
|
|
@@ -13,7 +13,6 @@ Extract Figma design data and generate production-ready component code, tailored
|
|
|
13
13
|
/vibe.figma "url" # Single design → project integrated (default)
|
|
14
14
|
/vibe.figma "mobile-url" "desktop-url" # Responsive — auto-detect viewport from frame width
|
|
15
15
|
/vibe.figma "url" --new # New feature — self-contained tokens, no existing design system dependency
|
|
16
|
-
/vibe.figma "url" --component LoginForm # Name the root component
|
|
17
16
|
/vibe.figma --local # Skip extraction, use existing figma-output/
|
|
18
17
|
```
|
|
19
18
|
|
|
@@ -58,6 +57,42 @@ When multiple URLs are provided:
|
|
|
58
57
|
|
|
59
58
|
> **⏱️ Timer**: Call `getCurrentTime` tool at the START. Record the result as `{start_time}`.
|
|
60
59
|
|
|
60
|
+
## Model Routing
|
|
61
|
+
|
|
62
|
+
| Phase | Claude | GPT (Codex) | 이유 |
|
|
63
|
+
|-------|--------|-------------|------|
|
|
64
|
+
| Phase 0 (추출) | **Haiku** | — | MCP 호출 + 데이터 수집 |
|
|
65
|
+
| Phase 1-2 (분석) | **Sonnet** | — | 이미지 비교 + 구조 파악 |
|
|
66
|
+
| Phase 3 (감지) | **Haiku** | — | 파일 읽기 + 패턴 매칭 |
|
|
67
|
+
| Phase 4-5 (토큰/마크업) | **Sonnet** | — | 토큰 매핑 + 시맨틱 판단 |
|
|
68
|
+
| Phase 6 (코드 생성) | **Sonnet** | **gpt-5.3-codex-spark** (병렬) | 섹션별 컴포넌트 병렬 생성 |
|
|
69
|
+
| Phase 7-8 (매핑/리포트) | **Sonnet** | — | 토큰 매핑 + 보고서 |
|
|
70
|
+
| Post (코드 리뷰) | — | **gpt-5.3-codex** | 생성 코드 품질 검증 |
|
|
71
|
+
|
|
72
|
+
### GPT 모델 선택 기준
|
|
73
|
+
|
|
74
|
+
| 모델 | config key | 용도 |
|
|
75
|
+
|------|-----------|------|
|
|
76
|
+
| `gpt-5.4` | `models.gpt` | 아키텍처 판단, 복잡한 추론 |
|
|
77
|
+
| `gpt-5.3-codex` | `models.gptCodex` | 코드 리뷰, 분석 (정확도 우선) |
|
|
78
|
+
| `gpt-5.3-codex-spark` | `models.gptCodexSpark` | 코드 생성 (속도 우선) |
|
|
79
|
+
|
|
80
|
+
`~/.vibe/config.json`의 `models` 에서 오버라이드 가능.
|
|
81
|
+
|
|
82
|
+
### Codex 병렬 활용 (codex-plugin-cc 설치 시)
|
|
83
|
+
|
|
84
|
+
```
|
|
85
|
+
Phase 6 — 컴포넌트 생성:
|
|
86
|
+
섹션 3개 이상 → /codex:rescue --background (gpt-5.3-codex-spark)
|
|
87
|
+
각 섹션 컴포넌트를 Codex에 병렬 위임, Claude는 루트 페이지 + 토큰 담당
|
|
88
|
+
|
|
89
|
+
Post — 코드 리뷰:
|
|
90
|
+
/codex:review (gpt-5.3-codex)
|
|
91
|
+
생성된 코드의 design fidelity + 코드 품질 크로스 검증
|
|
92
|
+
|
|
93
|
+
Codex 미설치 시 자동 스킵 — Claude만으로 순차 생성.
|
|
94
|
+
```
|
|
95
|
+
|
|
61
96
|
## Phase 0: Figma Data Extraction
|
|
62
97
|
|
|
63
98
|
**Skip this phase if `--local` flag is provided and `figma-output/` already exists.**
|
|
@@ -403,7 +438,7 @@ default (no flag):
|
|
|
403
438
|
|
|
404
439
|
**Step 2: 피처명 기반 폴더 생성**
|
|
405
440
|
|
|
406
|
-
|
|
441
|
+
Figma 파일명에서 피처명 자동 추출 → kebab-case 변환.
|
|
407
442
|
|
|
408
443
|
```
|
|
409
444
|
예: Figma 파일명 "PUBG 9주년 이벤트" → pubg-anniversary
|