sveltekit-structure — скилл для Claude Code: структура SvelteKit
Подсказывает агенту, как раскладывать маршруты, вложенные лейауты и границы ошибок в SvelteKit. Пригодится, когда проект растёт и файлы начинают путаться.
npx skills add spences10/svelte-skills-kit --skill sveltekit-structure -a claude-codeЧто делает sveltekit-structure
Скилл объясняет агенту правила файлов SvelteKit: +page.svelte для страницы, +layout.svelte для обёртки, +error.svelte для границы ошибок, +server.ts для эндпоинта. Маршрут src/routes/about/+page.svelte превращается в /about, а src/routes/posts/[id]/+page.svelte — в /posts/123. Лейаут на любом уровне оборачивает все дочерние маршруты, а папки в скобках вроде (name) на адрес не влияют.
Внутри пять справочных файлов: именование файлов, вложенные лейауты, размещение +error.svelte, компонентный svelte:boundary для ошибок и ожидания, а также SSR и код, который работает только в браузере. Основной SKILL.md держат коротким, детали уходят в references/.
Границы ошибок в SvelteKit лежат выше падающего маршрута — если поставить +error.svelte не на том уровне, он не поймает то, что вы ждёте. Это повод проверить дерево маршрутов перед тем, как просить агента что-то переписать. Для клиентского кода нужна проверка browser, иначе SSR упадёт на обращении к window.
Какие задачи решает
- разложить маршруты по папкам без путаницы
- вложить лейаут в часть приложения, а не во все страницы
- поставить
+error.svelteна нужный уровень дерева - добавить ожидание через
svelte:boundary - разделить серверный и браузерный код при SSR
Примеры запросов агенту
- Помоги разложить маршруты SvelteKit: у меня есть /dashboard и /dashboard/settings, нужен свой лейаут только для них
- Куда положить
+error.svelte, чтобы он ловил ошибки внутри /posts/[id]? - У меня падает SSR из-за
window— подскажи, как разделить серверный и клиентский код
Как установить sveltekit-structure
1Через Skills CLI (Vercel)
npx skills add spences10/svelte-skills-kit --skill sveltekit-structure -a claude-code2Вручную: положить файлы
~/.claude/skills/sveltekit-structure/SKILL.mdПапка скилла целиком; для одного проекта — .claude/skills/sveltekit-structure/
1Через Skills CLI (Vercel)
npx skills add spences10/svelte-skills-kit --skill sveltekit-structure -a codex2Вручную: положить файлы
.agents/skills/sveltekit-structure/SKILL.mdДля всех проектов — ~/.agents/skills/
1Через Skills CLI (Vercel)
npx skills add spences10/svelte-skills-kit --skill sveltekit-structure -a cursor2Вручную: положить файлы
.cursor/skills/sveltekit-structure/SKILL.mdCursor читает и .agents/skills/, и .claude/skills/
1GitHub CLI
gh skill install spences10/svelte-skills-kit sveltekit-structure2Вручную: положить файлы
.github/skills/sveltekit-structure/SKILL.md1Через Skills CLI (Vercel)
npx skills add spences10/svelte-skills-kit --skill sveltekit-structure -a gemini-cli2Командой платформы
gemini skills install https://github.com/spences10/svelte-skills-kit --path plugins/svelte-skills/skills/sveltekit-structureВручную: положить файлы
.devin/skills/sveltekit-structure/SKILL.mdСтарый путь .windsurf/skills/ тоже читается
Через Skills CLI (Vercel)
npx skills add spences10/svelte-skills-kit --skill sveltekit-structure -a opencodeClaude.ai
Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills
По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов
Вопросы о sveltekit-structure
Как установить sveltekit-structure в Claude?
Выполните npx skills add spences10/svelte-skills-kit --skill sveltekit-structure -a claude-code. Скилл окажется в ~/.claude/skills/sveltekit-structure/SKILL.md.
Что делает sveltekit-structure?
Даёт агенту правила структуры SvelteKit: именование файлов, вложенные лейауты, размещение +error.svelte, svelte:boundary и разделение SSR с браузерным кодом.
Для каких платформ подходит скилл?
Кроме Claude есть установка для Codex, Cursor, GitHub Copilot, Gemini CLI и OpenCode — у каждой своя команда и путь к SKILL.md.
