Document Svelte runes like $state, $derived, and $effect for reactivity.
npx skills add https://github.com/sandalsoft/agent-skills --skill svelte-runes-sandalsoft
Please help me install this Agent Skill. Skill: svelte-runes Source: https://github.com/sandalsoft/agent-skills/tree/main/svelte-runes Command: npx skills add https://github.com/sandalsoft/agent-skills --skill svelte-runes-sandalsoft
Svelte runes guidance helps developers avoid common reactivity mistakes when using top-level runes like $state, $derived, $effect, $props, and $bindable, providing a clear mental model and patterns.
Create a small Svelte component that defines a reactive state with $state, a derived value with $derived, and a simple side effect with $effect to verify reactivity behavior.
High-intent search queries and answers about installing and using this skill.
To use Svelte runes for reactive state and side effects, define $state for reactive variables, $derived for computed values, and $effect to trigger side effects, establishing a clear mental model that prevents common reactivity mistakes.
The best way to migrate from Svelte 4 to 5 is replacing reactive declarations with top-level runes like $state and $derived, utilizing provided migration tips and anti-pattern examples to ensure correct reactivity behavior.
$derived works by explicitly computing values from other reactive $state variables, replacing Svelte 4 reactive declarations. This explicit rune usage prevents reactivity mistakes and creates reusable patterns across components.
You need $props and $bindable in Svelte component design when passing data into components and creating two-way binding. These runes provide explicit, structured guidance for component inputs and prevent reactivity anti-patterns.
Reactivity mistakes in Svelte 5 components often happen when top-level runes like $state, $derived, or $effect are applied incorrectly. Following documented best practices and anti-pattern references helps correct this reactive state behavior.
Seeker1911Guide Svelte 5 rune usage for reactive state, props, and side effects.
Sanali209Guide Svelte 5 component authors on runes, snippets, and SvelteKit patterns.
inbharataiCreate Svelte 5 components with runes, stores, and SvelteKit integration.
AnExiledDevAdopt Svelte 5 runes for explicit component reactivity and state management.
