Svelte 5 안정화 — 프로덕션 적용 가이드

Svelte 5 안정 버전

Svelte 5가 안정 버전으로 출시되었습니다. Runes, Snippets, 이벤트 핸들러 변경이 핵심입니다.

Snippets (슬롯 대체)

<script>
  let { header, children } = $props();
</script>

{@render header()}
<div class="content">
  {@render children()}
</div>

<!-- 사용 -->
<Layout>
  {#snippet header()}
    <h1>제목</h1>
  {/snippet}
  <p>본문 내용</p>
</Layout>

이벤트 핸들러

on:click 대신 onclick 속성을 사용합니다. 이벤트 수식어도 변경되었습니다.