By ofershap
Audit SvelteKit codebases for Svelte 5 best practices violations, including runes ($state, $derived, $effect), $props(), $bindable(), load functions, form actions, and SSR patterns. Get reports with file/line locations, explanations, severity ratings (critical/warning/info), and correct patterns to modernize outdated Svelte 4 code.
SvelteKit and Svelte 5 done right. Runes ($state, $derived, $effect), $props(),
$bindable(), load functions, form actions, +page.server.ts, +layout.server.ts,
hooks.server.ts, snippets, and SSR patterns.
AI coding assistants generate Svelte 4 code -
writable()stores,export letprops,$:reactive declarations,onMountdata fetching. Svelte 5 replaced all of these with runes. This plugin stops your agent from writing dead syntax.
npx skills add ofershap/sveltekit-best-practices
Or copy skills/ into your .cursor/skills/ or .claude/skills/ directory.
| Type | Name | Description |
|---|---|---|
| Skill | sveltekit-best-practices | 14 rules for Svelte 5 runes, load functions, form actions, SSR, and more |
| Rule | best-practices | Always-on behavioral rule that enforces Svelte 5 / SvelteKit patterns |
| Command | /audit | Scan your codebase for Svelte 4 anti-patterns |
| What the agent writes (Svelte 4) | What Svelte 5 uses |
|---|---|
writable(), readable() stores | $state(), $derived() runes |
export let name for props | let { name } = $props() |
$: doubled = count * 2 | let doubled = $derived(count * 2) |
$: { sideEffect() } | $effect(() => { sideEffect() }) |
Data fetching in onMount | load() in +page.server.ts |
| API routes for form mutations | Form actions in +page.server.ts |
<slot /> for children | Snippets with {@render children()} |
$app/stores for page data | $app/state (Svelte 5) |
If this helped your workflow, a star helps others find it.
MIT
Own this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge. GitHub access is read-only (username + org membership).
Sign in to claimOwn this plugin?
Verify ownership to unlock analytics, metadata editing, and a verified badge. GitHub access is read-only (username + org membership).
Sign in to claimBased on adoption, maintenance, documentation, and repository signals. Not a security audit or endorsement.
Modern TypeScript patterns your AI agent should use. Strict mode, discriminated unions, satisfies operator, const assertions, and type-safe patterns for TypeScript 5.x.
Query and analyze your Cursor Enterprise team's AI usage, spending, and adoption metrics. Wraps the full Cursor Admin and Analytics APIs as MCP tools with expert data interpretation skills.
FastAPI done right. Async patterns, dependency injection, Pydantic v2 models, middleware, background tasks, and project structure for production APIs.
Drizzle ORM done right. Schema design, relations, migrations, type-safe queries, and performance patterns for the fastest-growing TypeScript ORM.
Modern Python 3.12+ patterns your AI agent should use. Type hints, async/await, Pydantic v2, uv package manager, match statements, and project structure.
npx claudepluginhub ofershap/sveltekit-best-practicesSvelte 5 runes, SvelteKit data flow, routing, and structure patterns
Svelte changes since training cutoff (latest: 5.0.0) — runes ($state, $derived, $effect, $props), snippets replacing slots, callback props replacing events, mount/hydrate API. Load before working with Svelte.
Specialized commands for Svelte and SvelteKit development
SvelteKit frontend development with Tailwind CSS v4, shadcn-svelte, and Bun server integration. Includes HTML-to-Svelte migration, app shell, routing, and component generators.
Svelte language server for Claude Code with go-to-definition, hover docs, references, and diagnostics on .svelte files.
Reusable UI component patterns for implementing common features across different frameworks and tech stacks