Sveltekit Routing File Based Layout Page

SvelteKit pakai konvensi file untuk routing. src/routes/+page.svelte = halaman; +layout.svelte = pembungkus.

Definisi

Folder = URL segment. [slug] dynamic, (group) tidak tampil di URL, +layout.svelte wrap child.

Kapan dipakai

Setiap app SvelteKit (pengganti router manual).

Cara kerja

svelte

<!-- src/routes/blog/[slug]/+page.svelte -->
<script>
  export let data;
</script>
<h1>{data.post.title}</h1>
 
<!-- src/routes/+layout.svelte -->
<nav>...</nav>
<slot />

Struktur alur

Catatan implementasi

• [param] wajib; [[param]] optional.
• +layout.svelte bisa nested.
• +error.svelte untuk error per-segment.

Kesalahan umum

• Nama file salah (page vs +page).
• Layout tidak <slot /> -> konten hilang.
• Dynamic param tidak di-handle di load.

Referensi terkait

• Svelte Memulai & Struktur
• SvelteKit Load Functions