svelte5-best-practices

SKILL.md

| Runes | $state, $derived, $effect, $props, $bindable, $inspect | runes.md | | Snippets | Replacing slots, {#snippet}, {@render} | snippets.md | | Events | onclick handlers, callback props, context API | events.md | | TypeScript | Props typing, generic components | typescript.md | | Migration | Svelte 4 to 5, stores to runes | migration.md |

| SvelteKit | Load functions, form actions, SSR, page typing | sveltekit.md | | Performance | Universal reactivity, avoiding over-reactivity, streaming | performance.md |

Svelte 5 ルーン、スニペット、SvelteKit パターン、TypeScript とコンポーネント開発の最新のベスト プラクティス。 Svelte 5 コンポーネントおよび SvelteKit アプリケーションを作成、レビュー、またはリファクタリングするときに使用します。トリガー: Svelte コンポーネント、ルーン ($state、$derived、$effect、$props、$bindable、$inspect)、スニペット ({#snippet}、{@render})、イベント処理、SvelteKit データの読み込み、フォーム アクション、Svelte 4 から Svelte 5 への移行、ストアからルーンへの移行、スロットからスニペットへの移行、TypeScript プロパティの入力、汎用コンポーネント、SSR 状態の分離、パフォーマンスの最適化、またはコンポーネントのテスト。 ソース: ejirocodes/agent-skills。

ターミナルまたはコマンドラインツール（Terminal、iTerm、Windows Terminal など）を開きます このコマンドをコピーして実行します: npx skills add https://github.com/ejirocodes/agent-skills --skill svelte5-best-practices インストール後、スキルは自動的に AI コーディング環境に設定され、Claude Code や Cursor で使用できるようになります

原文を見る