develop · subframeapp — скилл для Claude Code: что делает и как установить
Скилл помогает перенести макет Subframe в приложение или обновить существующую страницу. Он также объясняет границу между изменениями в коде и на холсте.
npx skills add SubframeApp/subframe --skill develop -a claude-codeЧто делает develop
Перед работой скилл предлагает изучить настройки синхронизации, компоненты и структуру приложения, чтобы определить, где хранятся тема и дизайн-система. Затем он направляет реализацию в компоненты и маршруты проекта, а для поведения страницы — в принятые в приложении шаблоны. Если Subframe ещё не настроен, инструкции по установке читаются только для задач с его компонентами или при сбое init/sync.
Для недостающих компонентов скилл предлагает синхронизацию по имени через CLI; уже подключённые компоненты не обновляются без запроса. Сгенерированные файлы остаются нетронутыми, а пользовательская логика размещается в обёртке. Код страницы и холст сами друг с другом не синхронизируются, поэтому изменения макета нужно отдельно перенести в приложение. Это важно учитывать при ожидании автоматического обновления страниц.
Какие задачи решает
- перенести макет Subframe в маршруты приложения
- обновить страницу с учётом локальных компонентов и темы
- выяснить, какая система задаёт тему и компоненты
- разобраться, как связаны холст и код
Примеры запросов агенту
- Реализуй этот макет Subframe в маршруте приложения и используй существующие компоненты.
- Проверь, какая система управляет темой и компонентами в этом проекте, затем собери страницу на её основе.
- Объясни, что синхронизирует CLI между Subframe и кодом, и что нужно переносить отдельно.
Как установить develop
1Через Skills CLI (Vercel)
npx skills add SubframeApp/subframe --skill develop -a claude-code2Вручную: положить файлы
~/.claude/skills/develop/SKILL.mdПапка скилла целиком; для одного проекта — .claude/skills/develop/
1Через Skills CLI (Vercel)
npx skills add SubframeApp/subframe --skill develop -a codex2Вручную: положить файлы
.agents/skills/develop/SKILL.mdДля всех проектов — ~/.agents/skills/
1Через Skills CLI (Vercel)
npx skills add SubframeApp/subframe --skill develop -a cursor2Вручную: положить файлы
.cursor/skills/develop/SKILL.mdCursor читает и .agents/skills/, и .claude/skills/
1GitHub CLI
gh skill install SubframeApp/subframe develop2Вручную: положить файлы
.github/skills/develop/SKILL.md1Через Skills CLI (Vercel)
npx skills add SubframeApp/subframe --skill develop -a gemini-cli2Командой платформы
gemini skills install https://github.com/SubframeApp/subframe --path plugins/subframe/skills/developВручную: положить файлы
.devin/skills/develop/SKILL.mdСтарый путь .windsurf/skills/ тоже читается
Через Skills CLI (Vercel)
npx skills add SubframeApp/subframe --skill develop -a opencodeClaude.ai
Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills
По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов
Вопросы о develop
Как установить develop в Claude Code?
Выполните npx skills add SubframeApp/subframe --skill develop -a claude-code. Файл скилла будет доступен по пути ~/.claude/skills/develop/SKILL.md.
Что делает скилл develop?
Он помогает реализовать или обновить страницы Subframe в приложении, опираясь на его компоненты либо на дизайн-систему проекта. Также описывает настройку компонентов и синхронизацию.
Синхронизирует ли CLI страницы приложения с холстом?
Нет. CLI переносит компоненты и файлы темы, а страницы реализуются отдельно. Изменённый макет нужно заново получить и вручную объединить с кодом по запросу.
Похожие скиллы
Всё по теме «Дизайн» →Сначала — develop от других авторов.
