Svelte入門：SvelteKitでの静的サイト生成 -Vol.2-

用語解説

2024.10.22

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

よっしー

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

今日は、SvelteKitでの静的サイト生成について解説しています。

背景
zero-configサポート
Options
おわりに

背景

SvelteKitでの静的サイト生成について調査する機会がありましたので、その時の内容を備忘として記事に残しました。

zero-configサポート

一部のプラットフォームではzero-configがサポートされています (今後さらにサポートされる予定です):

Vercel

これらのプラットフォームでは、adapter-static が最適な構成を提供できるように、アダプタオプションを省略する必要があります:

// svelte.config.js
export default {
	kit: {
		adapter: adapter()
	}
};

Options

pagespermalink
プリレンダリングされたページを書き込むディレクトリです。デフォルトは build です。

assetspermalink
静的アセット（static の内容、およびSvelteKitによって生成されたクライアントサイドのJSとCSS）を書き込むディレクトリです。通常、これは pages と同じであるべきで、デフォルトでは pages の値と同じになりますが、まれに、ページとアセットを別々の場所に出力する必要がある場合があります。

fallbackpermalink
SPAモード用のフォールバックページを指定します。例えば、index.html や 200.html、404.html などです。

precompresspermalink
true に設定すると、ファイルをbrotliとgzipで事前に圧縮します。これにより、.br と .gz ファイルが生成されます。

strictpermalink
デフォルトでは、adapter-static はアプリのすべてのページとエンドポイント（もしあれば）がプリレンダリングされているか、または fallback オプションが設定されているかをチェックします。このチェックは、アプリの一部が最終出力に含まれていないためにアクセスできない状態で誤って公開してしまうのを防ぐために存在します。これが問題ない場合（例えば、特定のページが条件付きでのみ存在する場合など）、strict を false に設定してこのチェックをオフにすることができます。