Sveltejs Academy · Lesson

+error.svelte for Custom Error Pages

Create custom error UIs that display the status code and message.

Custom Error UI

Create +error.svelte in any route folder for a tailored error page.

src/routes/+error.svelte catches errors anywhere not caught by a nested error boundary.

<!-- +error.svelte -->
<script>
  import { page } from "$app/stores";
</script>
<h1>{$page.status}: {$page.error?.message}</h1>