sveltekit-remote-functions — скилл для Claude Code
Подсказывает агенту, как писать query(), form(), command() и prerender() в файлах *.remote.ts. Пригодится, если вы уже включили экспериментальные remote-функции в SvelteKit.
npx skills add spences10/svelte-skills-kit --skill sveltekit-remote-functions -a claude-codeЧто делает sveltekit-remote-functions
Скилл описывает четыре вида remote-функций и когда какой брать: динамическое чтение через query(), прогрессивные формы через form(), мутации из обработчиков событий через command(), статические данные через prerender(). Экспортировать их нужно из файлов *.remote.ts или *.remote.js, которые лежат где угодно под src, кроме src/lib/server.
Внутри — короткий справочник по правилам: аргументы и возвращаемые значения проходят через devalue, поэтому функции, экземпляры классов, символы, циклические ссылки и RegExp туда не передать. Входные данные проверяются схемой Standard Schema (valibot, zod, arktype), либо явно отключаются через .unchecked. Для n+1-чтений есть query.batch(), а обновления клиента работают только с серверного согласия через requested(queryFn, limit), причём limit обязателен.
Remote-функции в SvelteKit пока экспериментальные — статус зафиксирован на версии 2.58.0. Чтобы они заработали, в svelte.config.js нужно включить experimental.remoteFunctions, а для await прямо в компонентах дополнительно compilerOptions.experimental.async. Без этих флагов скилл вам ничего не даст: код просто не соберётся.
Какие задачи решает
- выбрать между
query(),form()иcommand()для конкретного случая - написать файл
posts.remote.tsс валидацией черезvalibot - убрать n+1-запросы при подгрузке списка по тегу
- сделать форму, которая работает и без JavaScript
- обновить данные на клиенте после мутации через
.updates()
Примеры запросов агенту
- Напиши
posts.remote.tsсquery()для списка постов иcommand()для создания - Переделай форму на
form()с прогрессивным улучшением - Добавь
query.batch()в этот запрос, чтобы не было n+1
Как установить sveltekit-remote-functions
1Через Skills CLI (Vercel)
npx skills add spences10/svelte-skills-kit --skill sveltekit-remote-functions -a claude-code2Вручную: положить файлы
~/.claude/skills/sveltekit-remote-functions/SKILL.mdПапка скилла целиком; для одного проекта — .claude/skills/sveltekit-remote-functions/
1Через Skills CLI (Vercel)
npx skills add spences10/svelte-skills-kit --skill sveltekit-remote-functions -a codex2Вручную: положить файлы
.agents/skills/sveltekit-remote-functions/SKILL.mdДля всех проектов — ~/.agents/skills/
1Через Skills CLI (Vercel)
npx skills add spences10/svelte-skills-kit --skill sveltekit-remote-functions -a cursor2Вручную: положить файлы
.cursor/skills/sveltekit-remote-functions/SKILL.mdCursor читает и .agents/skills/, и .claude/skills/
1GitHub CLI
gh skill install spences10/svelte-skills-kit sveltekit-remote-functions2Вручную: положить файлы
.github/skills/sveltekit-remote-functions/SKILL.md1Через Skills CLI (Vercel)
npx skills add spences10/svelte-skills-kit --skill sveltekit-remote-functions -a gemini-cli2Командой платформы
gemini skills install https://github.com/spences10/svelte-skills-kit --path plugins/svelte-skills/skills/sveltekit-remote-functionsВручную: положить файлы
.devin/skills/sveltekit-remote-functions/SKILL.mdСтарый путь .windsurf/skills/ тоже читается
Через Skills CLI (Vercel)
npx skills add spences10/svelte-skills-kit --skill sveltekit-remote-functions -a opencodeClaude.ai
Упакуйте папку в zip и загрузите в Settings → Capabilities → Skills
По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов
Вопросы о sveltekit-remote-functions
Как установить sveltekit-remote-functions в Claude Code?
Выполните npx skills add spences10/svelte-skills-kit --skill sveltekit-remote-functions -a claude-code. Файл скилла окажется по пути ~/.claude/skills/sveltekit-remote-functions/SKILL.md.
Что делает sveltekit-remote-functions?
Даёт агенту правила и примеры для remote-функций SvelteKit: query(), form(), command() и prerender() в файлах *.remote.ts.
Нужно ли что-то включать в проекте?
Да. Remote-функции экспериментальные, поэтому в svelte.config.js включается experimental.remoteFunctions, а для await в компонентах — ещё и compilerOptions.experimental.async.
