--- name: sveltekit-structure # IMPORTANT: Keep description on ONE line for Claude Code compatibility # prettier-ignore description: SvelteKit structure guidance. Use for routing, layouts, error handling, SSR, or svelte:boundary. Covers file naming, nested layouts, error boundaries, pending UI, and hydration. --- # SvelteKit Structure ## Quick Start **File types:** `+page.svelte` (page) | `+layout.svelte` (wrapper) | `+error.svelte` (error boundary) | `+server.ts` (API endpoint) **Routes:** `src\/routes\/about\/+page.svelte` → `\/about` | `src\/routes\/posts\/[id]\/+page.svelte` → `\/posts\/123` **Layouts:** Apply to all child routes. `+layout.svelte` at any level wraps descendants. ## Example ``` src\/routes\/ ├── +layout.svelte # Root layout (all pages) ├── +page.svelte # Homepage \/ ├── about\/+page.svelte # \/about └── dashboard\/ ├── +layout.svelte # Dashboard layout (dashboard pages only) ├── +page.svelte # \/dashboard └── settings\/+page.svelte # \/dashboard\/settings ``` ```svelte