load 関数内で何か問題が発生した場合、SvelteKit はエラーページを表示します。

デフォルトのエラーページはやや味気ないです。 src/routes/+error.svelte コンポーネントを作成することでカスタマイズできます。

<script>
	import { page } from '$app/stores';
	import { emojis } from './emojis.js';
</script>

<h1>{$page.status} {$page.error.message}</h1>
<span style="font-size: 10em">
	{emojis[$page.status] ?? emojis[500]}
</span>

+error.svelte コンポーネントはルート +layout.svelte 内にレンダリングされることに注意してください。よりきめ細かい +error.svelte 境界を作成できます。

<h1>this error was expected</h1>

このコンポーネントは /expected に対してレンダリングされますが、ルート src/routes/+error.svelte ページは発生した他のエラーに対してレンダリングされます。