svelte - SvelteKit - load() はコンポーネントから呼び出されませんが、ページとして機能します

Question

以下のファイル test.svelte が /routes のページである場合、load() が正常に呼び出され、http://localhost:3000/test 経由でアクセスすると、取得した JSON 配列がテンプレートに入力されます。このファイルを /lib に移動し、コンポーネントとして /routes/index.svelte にインポートすると、http://localhost:3000 にアクセスしてもコンポーネントの load() メソッドが実行されません。

test.svelte

<script context="module" lang="ts">
  /**
     * @type {import('@sveltejs/kit').Load}
   */
  export async function load({ fetch }) {
    const url = '/api/announcement'
    const res: Response = await fetch(url)

    if (res.ok) {
      const sections: Announcement[] = await res.json()
      return {
        props: {
          sections
        }
      }
    }

    return {
      status: res.status,
      error: new Error(`Could not load ${url}`)
     }
  }
</script>

<script lang="ts">
  export let sections: Announcement[] = []
</script>

<template>
  {#each sections as section}
    <p>
      {section.title}<br/>
      {section.description}
    </p>
  {/each}
</template>

/lib からコンポーネントとしてロードしようとする routes/index.svelte は次のとおりです。

<script context="module" lang="ts">
  import Test from '$lib/test.svelte'
</script>

<template lang="pug">
  .container
    Test
</template>

明らかに間違ったことをしているようですが、Svelte と SvelteKit は初めてです。routes/index.svelte でデータを取得してコンポーネントに渡すことを検討しましたが、データの取得をコンポーネントにカプセル化して、よりシンプルに保ちたいと考えていました。