Svelte入門：リファレンス @sveltejs/kit -Vol.24-

用語解説

2025.03.16

この記事は約5分で読めます。

よっしー

こんにちは。よっしーです(^^)

今日は、SvelteKitのリファレンスについて解説しています。

背景

SvelteKitのリファレンスについて調査する機会がありましたので、その時の内容を備忘として記事に残しました。

interface Prerendered {…}

pages: Map
string,
{
	/** 出力ディレクトリを基準とした.htmlファイルの場所 */
	file: string;
}
>;

pathから{ file }オブジェクトへのマップです。/fooのようなパスはfoo.htmlに対応し、/bar/のようなパスはbar/index.htmlに対応します。

assets: Map
string,
{
	/** アセットのMIMEタイプ */
	type: string;
}
>;

pathから{ type }オブジェクトへのマップです。

redirects: Map
string,
{
	status: number;
	location: string;
}
>;

プリレンダリング中に検出されたリダイレクトのマップです。

paths: string[];

プリレンダリングされたパスの配列（trailingSlash設定に関わらず、末尾のスラッシュはありません）

Prerenderedインターフェースは、SvelteKitのプリレンダリング処理の結果を表す構造体です。プリレンダリングプロセスが完了した後、このインターフェースはアプリケーションの静的に生成された部分に関する情報を包括的に提供します。

このインターフェースは、SvelteKitのアダプターやプラグインで以下のような用途に使用されます：

静的ホスティング設定の生成: // Netlify用の_redirectsファイル生成の例 function generateRedirects(prerendered) { let content = ''; for (const [path, { status, location }] of prerendered.redirects) { content += `${path} ${location} ${status}\n`; } return content; }
サイトマップの生成: function generateSitemap(prerendered) { const baseUrl = 'https://example.com'; return ` <?xml version="1.0" encoding="UTF-8"?> <urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"> ${prerendered.paths.map(path => ` <url> <loc>${baseUrl}${path}</loc> </url> `).join('')} </urlset> `; }
デプロイ後処理: function postProcess(prerendered) { // HTMLページにサービスワーカー登録スクリプトを追加 for (const [path, { file }] of prerendered.pages) { // ファイルを読み込んで加工... } }

このインターフェースは、SvelteKitのプリレンダリング結果を外部ツールやプロセスと連携させる際の重要な橋渡し役となります。