Frameworki

SvelteKit apps

Builds and reviews SvelteKit 3 apps (and Kit 2 projects on the way up) - routes, load functions, form actions with progressive enhancement, page titles, server-only state and rendering options - so pages work before JavaScript, load without waterfalls and never leak data between users. Use when editing src/routes, a load or action, hooks, or SvelteKit config.

fe-sveltekitsveltekit7 regułładowane zawsze: 77 tokenów; przy użyciu: 1033 tokeny; w referencjach na żądanie: 1637 tokenów.

Instalacja

init instaluje ten skill, gdy projekt używa: sveltekit. Wybierz agenta, aby zobaczyć, gdzie trafią jego pliki.

npx github:dawidolko/frontend-skills init

Ten sposób nie był jeszcze testowany. npx i pnpm dlx są przetestowane; jeśli ten zawiedzie, użyj jednego z nich.

Bez --agents polecenie init rozpoznaje agentów po tym, co projekt już ma, a gdy nie znajdzie żadnego, pyta:

Po czym init rozpoznaje każdego z agentów (17)

Agent	Rozpoznawany po
Claude Code	`CLAUDE.md` `.claude` `CLAUDE.local.md`
OpenAI Codex	`.codex` `AGENTS.override.md`
Cursor	`.cursor` `.cursorrules`
GitHub Copilot	`.github/copilot-instructions.md` `.github/instructions` `.github/skills` `.github/prompts`
Gemini CLI	`GEMINI.md` `.gemini`
Antigravity CLI	`.agents/rules` `.agent/rules`
Devin / Windsurf	`.devin` `.windsurf` `.windsurfrules`
OpenCode	`opencode.json` `opencode.jsonc` `.opencode`
Cline	`.clinerules` `.cline`
Zed	`.rules` `.zed`
JetBrains Junie	`.junie`
Kiro	`.kiro`
Augment	`.augment` `.augment-guidelines`
Trae	`.trae`
Continue	`.continue`
Amazon Q Developer	`.amazonq`
Aider	`.aider.conf.yml` `CONVENTIONS.md`

Gdzie trafia fe-sveltekit dla: Claude Code

.claude/skills/fe-sveltekit/SKILL.mdskill
.claude/skills/fe-sveltekit/references/sveltekit.mdskill
.claude/rules/fe-sveltekit.mdplik reguł
CLAUDE.mdblok instrukcji

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

.claude/rules/fe-sveltekit.md

---
paths:
  - "src/routes/**/*"
  - "src/hooks*.*"
  - "src/app.html"
  - "src/lib/**/*"
  - "vite.config.*"
  - "svelte.config.*"
---

# SvelteKit apps (frontend-skills)

Builds and reviews SvelteKit 3 apps (and Kit 2 projects on the way up) - routes, load functions, form actions with progressive enhancement, page titles, server-only state and rendering options - so pages work before JavaScript, load without waterfalls and never leak data between users. Use when editing src/routes, a load or action, hooks, or SvelteKit config.

- Never keep per-request data in module-level variables of server code; use `event.locals`, the return of `load`, a database or a cookie (svelte/kit-shared-server-state).
- Forms post to form actions (`method="POST" action="?/name"`) and add `use:enhance`; never a form that works only through `onsubmit` (svelte/kit-form-actions).
- Every page sets its own `<title>` in `<svelte:head>`, or the layout renders one from page data (svelte/kit-page-title).
- Read `page`, `navigating`, `updated` from `$app/state`, never `$app/stores` (svelte/kit-app-state).
- Start independent requests together; `await parent()` after them; stream slow data as promises (svelte/kit-load-waterfall).
- Use the `fetch` passed to `load`, and check `res.ok` (js/fetch-check-ok).
- Secrets only in server code (`+page.server`, `hooks.server`, `src/lib/server`) through the private env module.
- Assets through imports or `asset()` from `$app/paths`; links through `resolve()` when the app has a base path (js/asset-import).
- `load` is pure: no writes to shared stores or globals.
- Keep `ssr` on; `prerender = true` only where every visitor gets the same page.

Before larger changes, read the full skill: `.claude/skills/fe-sveltekit/SKILL.md`. Explain any rule id with `npx github:dawidolko/frontend-skills explain <id>`.

Prawdziwy plik

Gdzie trafia fe-sveltekit dla: OpenAI Codex

.agents/skills/fe-sveltekit/SKILL.mdskill
.agents/skills/fe-sveltekit/references/sveltekit.mdskill
AGENTS.mdblok instrukcji

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

OpenAI Codex nie ma plików reguł zawężonych do typów plików; czyta skille i blok instrukcji.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

AGENTS.md

## Front-end work (frontend-skills)

- Before front-end work, read `.frontend-skills/profile.json` (the stack) and `.frontend-skills/lessons.md` (confirmed conventions of this project; they win over any skill).
- Use the installed `fe-*` skill that matches the files you edit.
- After changing UI code, run `npx github:dawidolko/frontend-skills audit --changed --json` and fix findings at `serious` and above; `explain <rule id>` gives the reason, the source and the fix.
- Name rule ids (such as `a11y/img-alt`) in reviews and commit messages.

Prawdziwy plik

Gdzie trafia fe-sveltekit dla: Cursor

.agents/skills/fe-sveltekit/SKILL.mdskill
.agents/skills/fe-sveltekit/references/sveltekit.mdskill
.cursor/rules/fe-sveltekit.mdcplik reguł
AGENTS.mdblok instrukcji

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

.cursor/rules/fe-sveltekit.mdc

---
description: Builds and reviews SvelteKit 3 apps (and Kit 2 projects on the way up) - routes, load functions, form actions with progressive enhancement, page titles, server-only state and rendering options - so pages work before JavaScript, load without waterfalls and never leak data between users. Use when editing src/routes, a load or action, hooks, or SvelteKit config.
globs: src/routes/**/*, src/hooks*.*, src/app.html, src/lib/**/*, vite.config.*, svelte.config.*
alwaysApply: false
---

# SvelteKit apps (frontend-skills)

- Never keep per-request data in module-level variables of server code; use `event.locals`, the return of `load`, a database or a cookie (svelte/kit-shared-server-state).
- Forms post to form actions (`method="POST" action="?/name"`) and add `use:enhance`; never a form that works only through `onsubmit` (svelte/kit-form-actions).
- Every page sets its own `<title>` in `<svelte:head>`, or the layout renders one from page data (svelte/kit-page-title).
- Read `page`, `navigating`, `updated` from `$app/state`, never `$app/stores` (svelte/kit-app-state).
- Start independent requests together; `await parent()` after them; stream slow data as promises (svelte/kit-load-waterfall).
- Use the `fetch` passed to `load`, and check `res.ok` (js/fetch-check-ok).
- Secrets only in server code (`+page.server`, `hooks.server`, `src/lib/server`) through the private env module.
- Assets through imports or `asset()` from `$app/paths`; links through `resolve()` when the app has a base path (js/asset-import).
- `load` is pure: no writes to shared stores or globals.
- Keep `ssr` on; `prerender = true` only where every visitor gets the same page.

Before larger changes, read the full skill: `.agents/skills/fe-sveltekit/SKILL.md`. Explain any rule id with `npx github:dawidolko/frontend-skills explain <id>`.

Prawdziwy plik

Gdzie trafia fe-sveltekit dla: GitHub Copilot

.agents/skills/fe-sveltekit/SKILL.mdskill
.agents/skills/fe-sveltekit/references/sveltekit.mdskill
.github/instructions/fe-sveltekit.instructions.mdplik reguł
AGENTS.mdblok instrukcji

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

.github/instructions/fe-sveltekit.instructions.md

---
applyTo: "src/routes/**/*,src/hooks*.*,src/app.html,src/lib/**/*,vite.config.*,svelte.config.*"
description: "Builds and reviews SvelteKit 3 apps (and Kit 2 projects on the way up) - routes, load functions, form actions with progressive enhancement, page titles, server-only state and rendering options - so pages work before JavaScript, load without waterfalls and never leak data between users. Use when editing src/routes, a load or action, hooks, or SvelteKit config."
---

# SvelteKit apps (frontend-skills)

- Never keep per-request data in module-level variables of server code; use `event.locals`, the return of `load`, a database or a cookie (svelte/kit-shared-server-state).
- Forms post to form actions (`method="POST" action="?/name"`) and add `use:enhance`; never a form that works only through `onsubmit` (svelte/kit-form-actions).
- Every page sets its own `<title>` in `<svelte:head>`, or the layout renders one from page data (svelte/kit-page-title).
- Read `page`, `navigating`, `updated` from `$app/state`, never `$app/stores` (svelte/kit-app-state).
- Start independent requests together; `await parent()` after them; stream slow data as promises (svelte/kit-load-waterfall).
- Use the `fetch` passed to `load`, and check `res.ok` (js/fetch-check-ok).
- Secrets only in server code (`+page.server`, `hooks.server`, `src/lib/server`) through the private env module.
- Assets through imports or `asset()` from `$app/paths`; links through `resolve()` when the app has a base path (js/asset-import).
- `load` is pure: no writes to shared stores or globals.
- Keep `ssr` on; `prerender = true` only where every visitor gets the same page.

Before larger changes, read the full skill: `.agents/skills/fe-sveltekit/SKILL.md`. Explain any rule id with `npx github:dawidolko/frontend-skills explain <id>`.

Prawdziwy plik

Gdzie trafia fe-sveltekit dla: Gemini CLI

.agents/skills/fe-sveltekit/SKILL.mdskill
.agents/skills/fe-sveltekit/references/sveltekit.mdskill
GEMINI.mdblok instrukcji

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

Gemini CLI: Gemini CLI was replaced by Antigravity CLI for unpaid tiers on 2026-06-18; choose "antigravity" too if you use it.

Gemini CLI nie ma plików reguł zawężonych do typów plików; czyta skille i blok instrukcji.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

GEMINI.md

## Front-end work (frontend-skills)

- Before front-end work, read `.frontend-skills/profile.json` (the stack) and `.frontend-skills/lessons.md` (confirmed conventions of this project; they win over any skill).
- Use the installed `fe-*` skill that matches the files you edit.
- After changing UI code, run `npx github:dawidolko/frontend-skills audit --changed --json` and fix findings at `serious` and above; `explain <rule id>` gives the reason, the source and the fix.
- Name rule ids (such as `a11y/img-alt`) in reviews and commit messages.

Prawdziwy plik

Gdzie trafia fe-sveltekit dla: Antigravity CLI

.agents/skills/fe-sveltekit/SKILL.mdskill
.agents/skills/fe-sveltekit/references/sveltekit.mdskill
.agents/rules/fe-sveltekit.mdplik reguł
AGENTS.mdblok instrukcji

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

.agents/rules/fe-sveltekit.md

---
trigger: glob
globs: "src/routes/**/*, src/hooks*.*, src/app.html, src/lib/**/*, vite.config.*, svelte.config.*"
description: "Builds and reviews SvelteKit 3 apps (and Kit 2 projects on the way up) - routes, load functions, form actions with progressive enhancement, page titles, server-only state and rendering options - so pages work before JavaScript, load without waterfalls and never leak data between users. Use when editing src/routes, a load or action, hooks, or SvelteKit config."
---

# SvelteKit apps (frontend-skills)

- Never keep per-request data in module-level variables of server code; use `event.locals`, the return of `load`, a database or a cookie (svelte/kit-shared-server-state).
- Forms post to form actions (`method="POST" action="?/name"`) and add `use:enhance`; never a form that works only through `onsubmit` (svelte/kit-form-actions).
- Every page sets its own `<title>` in `<svelte:head>`, or the layout renders one from page data (svelte/kit-page-title).
- Read `page`, `navigating`, `updated` from `$app/state`, never `$app/stores` (svelte/kit-app-state).
- Start independent requests together; `await parent()` after them; stream slow data as promises (svelte/kit-load-waterfall).
- Use the `fetch` passed to `load`, and check `res.ok` (js/fetch-check-ok).
- Secrets only in server code (`+page.server`, `hooks.server`, `src/lib/server`) through the private env module.
- Assets through imports or `asset()` from `$app/paths`; links through `resolve()` when the app has a base path (js/asset-import).
- `load` is pure: no writes to shared stores or globals.
- Keep `ssr` on; `prerender = true` only where every visitor gets the same page.

Before larger changes, read the full skill: `.agents/skills/fe-sveltekit/SKILL.md`. Explain any rule id with `npx github:dawidolko/frontend-skills explain <id>`.

Prawdziwy plik

Gdzie trafia fe-sveltekit dla: Devin / Windsurf

.agents/skills/fe-sveltekit/SKILL.mdskill
.agents/skills/fe-sveltekit/references/sveltekit.mdskill
.devin/rules/fe-sveltekit.mdplik reguł
AGENTS.mdblok instrukcji

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

Devin / Windsurf: Devin CLI also reads .cursor/rules; with Cursor chosen too, the CLI sees both rule files of a skill.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

.devin/rules/fe-sveltekit.md

---
trigger: glob
globs: "src/routes/**/*,src/hooks*.*,src/app.html,src/lib/**/*,vite.config.*,svelte.config.*"
---

# SvelteKit apps (frontend-skills)

Builds and reviews SvelteKit 3 apps (and Kit 2 projects on the way up) - routes, load functions, form actions with progressive enhancement, page titles, server-only state and rendering options - so pages work before JavaScript, load without waterfalls and never leak data between users. Use when editing src/routes, a load or action, hooks, or SvelteKit config.

- Never keep per-request data in module-level variables of server code; use `event.locals`, the return of `load`, a database or a cookie (svelte/kit-shared-server-state).
- Forms post to form actions (`method="POST" action="?/name"`) and add `use:enhance`; never a form that works only through `onsubmit` (svelte/kit-form-actions).
- Every page sets its own `<title>` in `<svelte:head>`, or the layout renders one from page data (svelte/kit-page-title).
- Read `page`, `navigating`, `updated` from `$app/state`, never `$app/stores` (svelte/kit-app-state).
- Start independent requests together; `await parent()` after them; stream slow data as promises (svelte/kit-load-waterfall).
- Use the `fetch` passed to `load`, and check `res.ok` (js/fetch-check-ok).
- Secrets only in server code (`+page.server`, `hooks.server`, `src/lib/server`) through the private env module.
- Assets through imports or `asset()` from `$app/paths`; links through `resolve()` when the app has a base path (js/asset-import).
- `load` is pure: no writes to shared stores or globals.
- Keep `ssr` on; `prerender = true` only where every visitor gets the same page.

Before larger changes, read the full skill: `.agents/skills/fe-sveltekit/SKILL.md`. Explain any rule id with `npx github:dawidolko/frontend-skills explain <id>`.

Prawdziwy plik

Gdzie trafia fe-sveltekit dla: OpenCode

.agents/skills/fe-sveltekit/SKILL.mdskill
.agents/skills/fe-sveltekit/references/sveltekit.mdskill
AGENTS.mdblok instrukcji

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

OpenCode nie ma plików reguł zawężonych do typów plików; czyta skille i blok instrukcji.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

AGENTS.md

## Front-end work (frontend-skills)

- Before front-end work, read `.frontend-skills/profile.json` (the stack) and `.frontend-skills/lessons.md` (confirmed conventions of this project; they win over any skill).
- Use the installed `fe-*` skill that matches the files you edit.
- After changing UI code, run `npx github:dawidolko/frontend-skills audit --changed --json` and fix findings at `serious` and above; `explain <rule id>` gives the reason, the source and the fix.
- Name rule ids (such as `a11y/img-alt`) in reviews and commit messages.

Prawdziwy plik

Gdzie trafia fe-sveltekit dla: Cline

.claude/skills/fe-sveltekit/SKILL.mdskill
.claude/skills/fe-sveltekit/references/sveltekit.mdskill
.clinerules/fe-sveltekit.mdplik reguł
AGENTS.mdblok instrukcji

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

Cline: If .clinerules is a single file rather than a folder, Cline rule files are not written; skills still are.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

.clinerules/fe-sveltekit.md

---
paths:
  - "src/routes/**/*"
  - "src/hooks*.*"
  - "src/app.html"
  - "src/lib/**/*"
  - "vite.config.*"
  - "svelte.config.*"
---

# SvelteKit apps (frontend-skills)

Builds and reviews SvelteKit 3 apps (and Kit 2 projects on the way up) - routes, load functions, form actions with progressive enhancement, page titles, server-only state and rendering options - so pages work before JavaScript, load without waterfalls and never leak data between users. Use when editing src/routes, a load or action, hooks, or SvelteKit config.

- Never keep per-request data in module-level variables of server code; use `event.locals`, the return of `load`, a database or a cookie (svelte/kit-shared-server-state).
- Forms post to form actions (`method="POST" action="?/name"`) and add `use:enhance`; never a form that works only through `onsubmit` (svelte/kit-form-actions).
- Every page sets its own `<title>` in `<svelte:head>`, or the layout renders one from page data (svelte/kit-page-title).
- Read `page`, `navigating`, `updated` from `$app/state`, never `$app/stores` (svelte/kit-app-state).
- Start independent requests together; `await parent()` after them; stream slow data as promises (svelte/kit-load-waterfall).
- Use the `fetch` passed to `load`, and check `res.ok` (js/fetch-check-ok).
- Secrets only in server code (`+page.server`, `hooks.server`, `src/lib/server`) through the private env module.
- Assets through imports or `asset()` from `$app/paths`; links through `resolve()` when the app has a base path (js/asset-import).
- `load` is pure: no writes to shared stores or globals.
- Keep `ssr` on; `prerender = true` only where every visitor gets the same page.

Before larger changes, read the full skill: `.claude/skills/fe-sveltekit/SKILL.md`. Explain any rule id with `npx github:dawidolko/frontend-skills explain <id>`.

Prawdziwy plik

Gdzie trafia fe-sveltekit dla: Zed

.agents/skills/fe-sveltekit/SKILL.mdskill
.agents/skills/fe-sveltekit/references/sveltekit.mdskill
CLAUDE.mdblok instrukcji

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

Zed: Zed reads only the first instruction file of its list; the block is placed in that file.

Zed nie ma plików reguł zawężonych do typów plików; czyta skille i blok instrukcji.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

CLAUDE.md

## Front-end work (frontend-skills)

- Before front-end work, read `.frontend-skills/profile.json` (the stack) and `.frontend-skills/lessons.md` (confirmed conventions of this project; they win over any skill).
- Use the installed `fe-*` skill that matches the files you edit.
- After changing UI code, run `npx github:dawidolko/frontend-skills audit --changed --json` and fix findings at `serious` and above; `explain <rule id>` gives the reason, the source and the fix.
- Name rule ids (such as `a11y/img-alt`) in reviews and commit messages.

Prawdziwy plik

Gdzie trafia fe-sveltekit dla: JetBrains Junie

.agents/skills/fe-sveltekit/SKILL.mdskill
.agents/skills/fe-sveltekit/references/sveltekit.mdskill
AGENTS.mdblok instrukcji

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

JetBrains Junie: Junie reads .agents/skills only in a trusted project.

JetBrains Junie nie ma plików reguł zawężonych do typów plików; czyta skille i blok instrukcji.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

AGENTS.md

## Front-end work (frontend-skills)

- Before front-end work, read `.frontend-skills/profile.json` (the stack) and `.frontend-skills/lessons.md` (confirmed conventions of this project; they win over any skill).
- Use the installed `fe-*` skill that matches the files you edit.
- After changing UI code, run `npx github:dawidolko/frontend-skills audit --changed --json` and fix findings at `serious` and above; `explain <rule id>` gives the reason, the source and the fix.
- Name rule ids (such as `a11y/img-alt`) in reviews and commit messages.

Prawdziwy plik

Gdzie trafia fe-sveltekit dla: Kiro

.kiro/skills/fe-sveltekit/SKILL.mdskill
.kiro/skills/fe-sveltekit/references/sveltekit.mdskill
.kiro/steering/fe-sveltekit.mdplik reguł
AGENTS.mdblok instrukcji

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

.kiro/steering/fe-sveltekit.md

---
inclusion: fileMatch
fileMatchPattern: ["src/routes/**/*", "src/hooks*.*", "src/app.html", "src/lib/**/*", "vite.config.*", "svelte.config.*"]
---

# SvelteKit apps (frontend-skills)

Builds and reviews SvelteKit 3 apps (and Kit 2 projects on the way up) - routes, load functions, form actions with progressive enhancement, page titles, server-only state and rendering options - so pages work before JavaScript, load without waterfalls and never leak data between users. Use when editing src/routes, a load or action, hooks, or SvelteKit config.

- Never keep per-request data in module-level variables of server code; use `event.locals`, the return of `load`, a database or a cookie (svelte/kit-shared-server-state).
- Forms post to form actions (`method="POST" action="?/name"`) and add `use:enhance`; never a form that works only through `onsubmit` (svelte/kit-form-actions).
- Every page sets its own `<title>` in `<svelte:head>`, or the layout renders one from page data (svelte/kit-page-title).
- Read `page`, `navigating`, `updated` from `$app/state`, never `$app/stores` (svelte/kit-app-state).
- Start independent requests together; `await parent()` after them; stream slow data as promises (svelte/kit-load-waterfall).
- Use the `fetch` passed to `load`, and check `res.ok` (js/fetch-check-ok).
- Secrets only in server code (`+page.server`, `hooks.server`, `src/lib/server`) through the private env module.
- Assets through imports or `asset()` from `$app/paths`; links through `resolve()` when the app has a base path (js/asset-import).
- `load` is pure: no writes to shared stores or globals.
- Keep `ssr` on; `prerender = true` only where every visitor gets the same page.

Before larger changes, read the full skill: `.kiro/skills/fe-sveltekit/SKILL.md`. Explain any rule id with `npx github:dawidolko/frontend-skills explain <id>`.

Prawdziwy plik

Gdzie trafia fe-sveltekit dla: Augment

.agents/skills/fe-sveltekit/SKILL.mdskill
.agents/skills/fe-sveltekit/references/sveltekit.mdskill
AGENTS.mdblok instrukcji

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

Augment nie ma plików reguł zawężonych do typów plików; czyta skille i blok instrukcji.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

AGENTS.md

## Front-end work (frontend-skills)

- Before front-end work, read `.frontend-skills/profile.json` (the stack) and `.frontend-skills/lessons.md` (confirmed conventions of this project; they win over any skill).
- Use the installed `fe-*` skill that matches the files you edit.
- After changing UI code, run `npx github:dawidolko/frontend-skills audit --changed --json` and fix findings at `serious` and above; `explain <rule id>` gives the reason, the source and the fix.
- Name rule ids (such as `a11y/img-alt`) in reviews and commit messages.

Prawdziwy plik

Gdzie trafia fe-sveltekit dla: Trae

.trae/skills/fe-sveltekit/SKILL.mdskill
.trae/skills/fe-sveltekit/references/sveltekit.mdskill
.trae/rules/fe-sveltekit.mdplik reguł
AGENTS.mdblok instrukcji

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

Trae: Trae reads AGENTS.md only after it is enabled in its settings.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

.trae/rules/fe-sveltekit.md

---
description: "Builds and reviews SvelteKit 3 apps (and Kit 2 projects on the way up) - routes, load functions, form actions with progressive enhancement, page titles, server-only state and rendering options - so pages work before JavaScript, load without waterfalls and never leak data between users. Use when editing src/routes, a load or action, hooks, or SvelteKit config."
globs: src/routes/**/*,src/hooks*.*,src/app.html,src/lib/**/*,vite.config.*,svelte.config.*
alwaysApply: false
---

# SvelteKit apps (frontend-skills)

- Never keep per-request data in module-level variables of server code; use `event.locals`, the return of `load`, a database or a cookie (svelte/kit-shared-server-state).
- Forms post to form actions (`method="POST" action="?/name"`) and add `use:enhance`; never a form that works only through `onsubmit` (svelte/kit-form-actions).
- Every page sets its own `<title>` in `<svelte:head>`, or the layout renders one from page data (svelte/kit-page-title).
- Read `page`, `navigating`, `updated` from `$app/state`, never `$app/stores` (svelte/kit-app-state).
- Start independent requests together; `await parent()` after them; stream slow data as promises (svelte/kit-load-waterfall).
- Use the `fetch` passed to `load`, and check `res.ok` (js/fetch-check-ok).
- Secrets only in server code (`+page.server`, `hooks.server`, `src/lib/server`) through the private env module.
- Assets through imports or `asset()` from `$app/paths`; links through `resolve()` when the app has a base path (js/asset-import).
- `load` is pure: no writes to shared stores or globals.
- Keep `ssr` on; `prerender = true` only where every visitor gets the same page.

Before larger changes, read the full skill: `.trae/skills/fe-sveltekit/SKILL.md`. Explain any rule id with `npx github:dawidolko/frontend-skills explain <id>`.

Prawdziwy plik

Gdzie trafia fe-sveltekit dla: Continue

.frontend-skills/skills/fe-sveltekit/SKILL.mdskill
.frontend-skills/skills/fe-sveltekit/references/sveltekit.mdskill
.continue/rules/fe-sveltekit.mdplik reguł

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

.continue/rules/fe-sveltekit.md

---
name: "SvelteKit apps"
description: "Builds and reviews SvelteKit 3 apps (and Kit 2 projects on the way up) - routes, load functions, form actions with progressive enhancement, page titles, server-only state and rendering options - so pages work before JavaScript, load without waterfalls and never leak data between users. Use when editing src/routes, a load or action, hooks, or SvelteKit config."
globs: ["src/routes/**/*", "src/hooks*.*", "src/app.html", "src/lib/**/*", "vite.config.*", "svelte.config.*"]
alwaysApply: false
---

# SvelteKit apps (frontend-skills)

- Never keep per-request data in module-level variables of server code; use `event.locals`, the return of `load`, a database or a cookie (svelte/kit-shared-server-state).
- Forms post to form actions (`method="POST" action="?/name"`) and add `use:enhance`; never a form that works only through `onsubmit` (svelte/kit-form-actions).
- Every page sets its own `<title>` in `<svelte:head>`, or the layout renders one from page data (svelte/kit-page-title).
- Read `page`, `navigating`, `updated` from `$app/state`, never `$app/stores` (svelte/kit-app-state).
- Start independent requests together; `await parent()` after them; stream slow data as promises (svelte/kit-load-waterfall).
- Use the `fetch` passed to `load`, and check `res.ok` (js/fetch-check-ok).
- Secrets only in server code (`+page.server`, `hooks.server`, `src/lib/server`) through the private env module.
- Assets through imports or `asset()` from `$app/paths`; links through `resolve()` when the app has a base path (js/asset-import).
- `load` is pure: no writes to shared stores or globals.
- Keep `ssr` on; `prerender = true` only where every visitor gets the same page.

Before larger changes, read the full skill: `.frontend-skills/skills/fe-sveltekit/SKILL.md`. Explain any rule id with `npx github:dawidolko/frontend-skills explain <id>`.

Prawdziwy plik

Gdzie trafia fe-sveltekit dla: Amazon Q Developer

.frontend-skills/skills/fe-sveltekit/SKILL.mdskill
.frontend-skills/skills/fe-sveltekit/references/sveltekit.mdskill
.amazonq/rules/frontend-skills.mdblok instrukcji

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

Amazon Q Developer: Amazon Q Developer IDE plugins reach end of support on 2027-04-30; AWS points to Kiro.

Amazon Q Developer nie ma plików reguł zawężonych do typów plików; czyta skille i blok instrukcji.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

.amazonq/rules/frontend-skills.md

## Front-end work (frontend-skills)

- Before front-end work, read `.frontend-skills/profile.json` (the stack) and `.frontend-skills/lessons.md` (confirmed conventions of this project; they win over any skill).
- Use the installed `fe-*` skill that matches the files you edit.
- After changing UI code, run `npx github:dawidolko/frontend-skills audit --changed --json` and fix findings at `serious` and above; `explain <rule id>` gives the reason, the source and the fix.
- Name rule ids (such as `a11y/img-alt`) in reviews and commit messages.

### Skills

- `fe-sveltekit` (SvelteKit apps): when editing `src/routes/**/*`, `src/hooks*.*`, `src/app.html`, `src/lib/**/*`, `vite.config.*`, `svelte.config.*`, first read `.frontend-skills/skills/fe-sveltekit/SKILL.md`.

Prawdziwy plik

Gdzie trafia fe-sveltekit dla: Aider

.frontend-skills/skills/fe-sveltekit/SKILL.mdskill
.frontend-skills/skills/fe-sveltekit/references/sveltekit.mdskill
CONVENTIONS.mdblok instrukcji
.aider.conf.ymlkonfiguracja

Dla każdego agenta także: .frontend-skills/profile.json, .frontend-skills/lessons.md i .frontend-skills/install.json.

Aider nie ma plików reguł zawężonych do typów plików; czyta skille i blok instrukcji.

Zaplanowane przez sam instalator dla przykładowego projektu React z repozytorium.

CONVENTIONS.md

## Front-end work (frontend-skills)

- Before front-end work, read `.frontend-skills/profile.json` (the stack) and `.frontend-skills/lessons.md` (confirmed conventions of this project; they win over any skill).
- Use the installed `fe-*` skill that matches the files you edit.
- After changing UI code, run `npx github:dawidolko/frontend-skills audit --changed --json` and fix findings at `serious` and above; `explain <rule id>` gives the reason, the source and the fix.
- Name rule ids (such as `a11y/img-alt`) in reviews and commit messages.

### Skills

- `fe-sveltekit` (SvelteKit apps): when editing `src/routes/**/*`, `src/hooks*.*`, `src/app.html`, `src/lib/**/*`, `vite.config.*`, `svelte.config.*`, first read `.frontend-skills/skills/fe-sveltekit/SKILL.md`.

Prawdziwy plik

Jak go używać

Po instalacji agent sam ładuje skill, gdy zadanie pasuje do jego opisu. Możesz też poprosić o niego własnymi słowami, na przykład:

A żeby sprawdzić i poprawić pracę:

Użyj skilla fe-sveltekit na tym pliku.
Uruchom audyt front-endu na moich zmianach i popraw wszystko, co poważne.
Wyjaśnij svelte/kit-shared-server-state i popraw to tutaj.

Reguły, których uczy

svelte/kit-shared-server-state
Server code of a SvelteKit app never keeps per-request data in module-level variables; the module is shared by every user.
poważnastatyczne
svelte/kit-form-actions
A SvelteKit form posts to a form action (method and action) and is enhanced with use:enhance, not handled only by onsubmit.
umiarkowanastatyczne
svelte/kit-page-title
Every SvelteKit page sets its own descriptive title in svelte:head, or its layout renders a title from page data.
poważnastatyczneWCAG 2.4.2
svelte/kit-app-state
Read page, navigating and updated from $app/state, not the $app/stores module that SvelteKit 3 removed.
umiarkowanastatyczne
svelte/kit-load-waterfall
A load function starts independent requests together and awaits parent() only after them, so data does not load in a chain.
umiarkowanaręczne
js/asset-import
In a bundled project, images, fonts and media in component markup are imported or use the base-path helper, not hard-coded root paths.
umiarkowanastatyczne
js/fetch-check-ok
After fetch, check response.ok (or the status) before reading the body; fetch does not reject on 404 or 500.
umiarkowanastatyczne

Skrót reguł

Ta część jest kopiowana do zawężonego pliku reguł każdego agenta, więc musi być zrozumiała sama w sobie:

Never keep per-request data in module-level variables of server code; use event.locals, the return of load, a database or a cookie (svelte/kit-shared-server-state).
Forms post to form actions (method="POST" action="?/name") and add use:enhance; never a form that works only through onsubmit (svelte/kit-form-actions).
Every page sets its own <title> in <svelte:head>, or the layout renders one from page data (svelte/kit-page-title).
Read page, navigating, updated from $app/state, never $app/stores (svelte/kit-app-state).
Start independent requests together; await parent() after them; stream slow data as promises (svelte/kit-load-waterfall).
Use the fetch passed to load, and check res.ok (js/fetch-check-ok).
Secrets only in server code (+page.server, hooks.server, src/lib/server) through the private env module.
Assets through imports or asset() from $app/paths; links through resolve() when the app has a base path (js/asset-import).
load is pure: no writes to shared stores or globals.
Keep ssr on; prerender = true only where every visitor gets the same page.

Kroki, które wykonuje agent

Check the Kit version first. Kit 3: config in vite.config.js (sveltekit({ ... })), #lib from package.json imports, $app/env/private and $app/env/public, no base/assets (use resolve, asset). Kit 2: svelte.config.js, $lib, $env/.... Upgrade with npx sv migrate sveltekit-3.
Data that needs the database or secrets goes in +page.server.js load; public API data in +page.js load with the provided fetch.
Actions validate input on the server, return fail(400, { values, errors }), and the page shows the errors next to their fields (see fe-a11y-forms).
Filters, sorting and tabs that should survive a reload live in the URL (method="GET" forms, url.searchParams in load).
Throw error(404, 'Not found') and redirect(303, '/login') from @sveltejs/kit; in Kit 3 the message is a string and an external redirect needs the external option.
Set lang in src/app.html (per page through the handle hook for several languages), and keep Kit's focus reset after navigation.

Jak agent sprawdza swoją pracę

npx github:dawidolko/frontend-skills audit --changed reports shared server state, JavaScript-only forms, pages without a title and $app/stores imports. The audit reads .ts route files only through these project checks.
npx sv check --fail-on-warnings for types and compiler warnings; vite build fails on server-only imports in client code.
Test with JavaScript disabled: forms and links must still work.

Sprawdzane audytem

Testy statyczne tych reguł działają w audit; to prawdziwa sesja na przykładowym projekcie:

Nagranie terminala: audit wypisuje znaleziska według wagi z identyfikatorami reguł i miejscem plik:linia i kończy się błędem od progu serious. — `audit`: liczby według wagi, każda reguła z pierwszym miejscem, kod wyjścia.

Pliki referencyjne

references/sveltekit.md1637 tokenów

SKILL.md na GitHubie