What runes does this skill cover?

It covers all core Svelte 5 runes including $state for mutable state, $derived for computed values, $effect for side effects, and $props for component communication.

How does it handle the transition from slots to snippets?

The skill provides patterns for using the {@render ...} tag and snippet syntax, replacing the older slot-based composition model.

Does this skill support Svelte 4 to 5 migration?

Yes, it provides specific guidance and translation patterns for converting legacy Svelte 4 syntax into the modern Svelte 5 Runes system.

Is the skill updated for the latest Svelte 5.25+ changes?

Yes, the skill includes the latest patterns, such as the ability to reassign $derived values and using const for read-only derivations.

Svelte 5 Runes

Name: Svelte 5 Runes
Author: linehaul-ai

bylinehaul-ai

•

开发者工具

Provides expert guidance on Svelte 5 Runes for building reactive state, managing component props, and migrating legacy Svelte applications.

关于

Svelte 5 Runes is a specialized Claude Code skill designed to streamline development using Svelte's functional reactivity system. It assists developers in implementing $state, $derived, and $effect patterns while ensuring best practices for component APIs with $props and $bindable. By preventing the mixing of Svelte 4 and 5 syntaxes and offering clear migration patterns, it helps teams modernize their frontend codebases efficiently while avoiding common reactivity pitfalls and anti-patterns.

主要功能

Component API patterns using $props and $bindable
1 GitHub stars
Migration strategies and translation from Svelte 4 to Svelte 5
Validation of modern event handler syntax (onclick vs on:click)
Implementation of Svelte 5 core runes ($state, $derived, $effect)
Guidance on the new snippet and render tag syntax

使用场景

Creating reusable component libraries using modern Svelte patterns
Building highly reactive frontend dashboards with complex state management
Upgrading existing Svelte 4 projects to the Svelte 5 Runes API

关于

主要功能

Component API patterns using $props and $bindable
1 GitHub stars
Migration strategies and translation from Svelte 4 to Svelte 5
Validation of modern event handler syntax (onclick vs on:click)
Implementation of Svelte 5 core runes ($state, $derived, $effect)
Guidance on the new snippet and render tag syntax

使用场景

Creating reusable component libraries using modern Svelte patterns
Building highly reactive frontend dashboards with complex state management
Upgrading existing Svelte 4 projects to the Svelte 5 Runes API