Configuration

<script> と <style> 要素の制限に hash と nonce のどちらを使用するか。'auto' の場合、プリレンダリングされたページには hash を、動的にレンダリングされるページには nonce が使用されます。

Content-Security-Policy ヘッダーに追加されるディレクティブです。

Content-Security-Policy-Report-Only ヘッダーに追加されるディレクティブです。

POST、PUT、PATCH、DELETE でのフォーム送信時、受信した origin ヘッダーをチェックしてサーバーのオリジン(origin)と一致するか検証することを行うかどうか。

あなたのアプリに対し、別のオリジンから POST、PUT、PATCH、DELETE のリクエスト (Content-Type は application/x-www-form-urlencoded、multipart/form-data、text/plain のいずれか) をできるようにするには、このオプションを無効にする必要があります。ご注意を!

Automatically add server-side fetched URLs to the dependencies map of load functions. This will expose secrets to the client if your URL contains them.

.env ファイルを探すディレクトリです。

クライアントサイドコードに公開されても安全な環境変数に付与される接頭辞です。$env/static/public と $env/dynamic/public をご覧ください。Vite の環境変数ハンドリングを使用する場合は、別途 Vite の envPrefix を設定する必要があることにご注意ください - ただし、通常この機能を使う必要はありません。

A prefix that signals that an environment variable is unsafe to expose to client-side code. Environment variables matching neither the public nor the private prefix will be discarded completely. See $env/static/private and $env/dynamic/private.

favicon.ico や manifest.json のように、不変の URL を持つ、何も処理されない静的なファイルを置く場所です

コードベース全体から $lib としてアクセスできる、アプリの内部ライブラリ

parameter matchers を置くディレクトリ

アプリの構造を定義するファイル (Routing をご覧ください)

service worker のエントリーポイントのロケーション (Service workers をご覧ください)

HTML レスポンスのテンプレートのロケーション

フォールバックエラーレスポンスのテンプレートのロケーション

SvelteKit は初期ページに必要な JavaScript モジュールをプリロードすることで、インポートの 'ウォーターフォール' を回避し、アプリケーションの起動を高速化します。 異なるトレードオフを持つ3つの戦略があります:

• modulepreload - <link rel="modulepreload"> を使用します。これは Chromium ベースのブラウザ、Firefox 115 以上、Safari 17 以上ではベストな結果をもたらします。古いブラウザでは無視されます。
• preload-js - <link rel="preload"> を使用します。Chromium と Safari でウォーターフォールを防ぎますが、Chromium は書くモジュールを2回パースします (script として1回、module として1回)。Firefox ではモジュールが2回リクエストされるようになります。これは、Chromium ユーザーのパフォーマンスをわずかに低下させるのと引き換えに、iOS デバイスのユーザーのパフォーマンスを最大化したい場合には有効な設定です。
• preload-mjs - <link rel="preload"> を使用しますが、.mjs 拡張子であるため、Chromium が二重でパースすることを防ぎます。一部の静的 Web サーバーでは、.mjs ファイルを Content-Type: application/javascript ヘッダーとともに提供すると失敗となり、アプリケーションを壊すことになります。それがもしあなたにあてはまらないのなら、modulepreload がより広くサポートされるまで、これが多くのユーザーにベストなパフォーマンスをもたらすオプションです。

アプリのファイルが提供される絶対パス(absolute path)です。これは、何らかのストレージバケットからファイルを提供する場合に有用です。

ルート相対なパス(root-relative path)です。空文字(empty string)以外を指定する場合、先頭は / を付ける必要があり、末尾には / を付けてはいけません (例: /base-path)。アプリがどこから提供されるかを指定することで、アプリをルートではないパス(non-root path)で動作させることができます。ルート相対(root-relative)なリンクには、先頭に base の値を追加しなければなりません。そうしないとリンクが base ではなくドメインのルート(root)を指してしまいます(これはブラウザの動作によるものです)。これを行うには、base from $app/paths をインポートして <a href="{base}/your-page">Link</a> のようにします。もし、これを頻繁に書くようであれば、再利用可能なコンポーネントに抽出するのも良いでしょう。

相対アセットパスを使うかどうか。デフォルトでは、paths.assets が外部ではない場合、SvelteKit は %sveltekit.assets% を相対パスに置き換え、ビルド成果物の参照に対する相対パスを使用しますが、$app/paths からインポートする base と assets は、あなたの設定で指定された通りになります。

true の場合、$app/paths からインポートする base と assets は、サーバーサイドレンダリング中に相対アセットパスに置き換えられ、ポータブルな HTML になります。 false の場合、%sveltekit.assets% とビルド成果物への参照は、paths.assets が外部 URL でない限り、常にルート相対(root-relative)なパスとなります。

もしアプリで <base> 要素を使用している場合、これを false に設定してください。そうしないとアセットの URL が誤って現在のページではなく <base> URL に対して解決されてしまいます。

同時にいくつのページをプリレンダリングできるか。JS はシングルスレッドですが、プリレンダリングのパフォーマンスがネットワークに縛られている場合(例えば、リモートの CMS からコンテンツをロードしている場合)、ネットワークの応答を待っている間に他のタスクを処理することで高速化することができます。

SvelteKit が entries からリンクをたどってプリレダリングするページを探すかどうか。

プリレンダリングするページ、または (crawl: true の場合は) クローリングを開始するページの配列。* 文字列は、全ての動的でないルート(route) (つまり、[parameters] がないページです。なぜなら、SvelteKit は その parameters がどんな値を持つかわからないからです) が含まれます。

アプリのプリレンダリング中に発生した HTTP エラーに対する応答方法。

• 'fail' — ビルドを失敗させます
• 'ignore' - 失敗(failure)を無視して継続させます
• 'warn' — 継続しますが、警告(warning)をプリントします
• (details) => void — status、path、referrer、referenceType、message プロパティを持つ details オブジェクトを引数に取るカスタムのエラーハンドラです。この関数から throw されると、ビルドが失敗します

ts
/** @type {import('@sveltejs/kit').Config} */
const config = {
	kit: {
		prerender: {
			handleHttpError: ({ path, referrer, message }) => {
				// ignore deliberate link to shiny 404 page
				if (path === '/not-found' && referrer === '/blog/how-we-built-our-404-page') {
					return;
				}

				// otherwise fail the build
				throw new Error(message);
			}
		}
	}
};

あるプリレンダリングページから別のプリレンダリングページへのハッシュリンクが、リンク先ページの id に対応していない場合の応答方法

• 'fail' — ビルドを失敗させます
• 'ignore' - 失敗(failure)を無視して継続させます
• 'warn' — 継続しますが、警告(warning)をプリントします
• (details) => void — path、id、referrers、message プロパティを持つ details オブジェクトを引数に取るカスタムのエラーハンドラです。この関数から throw されると、ビルドが失敗します

entries エクスポートで生成されたエントリーが、生成されたルート(route)とマッチしない場合の応答方法。

• 'fail' — ビルドを失敗させます
• 'ignore' - 失敗(failure)を無視して継続させます
• 'warn' — 継続しますが、警告(warning)をプリントします
• (details) => void — generatedFromId、entry、matchedId、message プロパティを持つ details オブジェクトを引数に取るカスタムのエラーハンドラです。この関数から throw されると、ビルドが失敗します

origin — プリレンダリング時の url.origin の値です。レンダリングされたコンテンツに含まれていると有用な場合があります。

service worker が存在する場合、自動的に登録するかどうか。

static ディレクトリにあるどのファイルを $service-worker.files で利用可能にするかを決定します。

A function that allows you to edit the generated tsconfig.json. You can mutate the config (recommended) or return a new one. This is useful for extending a shared tsconfig.json in a monorepo root, for example.

アプリの現在のバージョンの文字列です。これを指定する場合は、決定論的なものでないといけません (例えば Math.random() や Date.now().toString() ではなく commit ref )。指定しない場合は、ビルドのタイムスタンプがデフォルトとなります

例えば、現在のコミットハッシュを使用するには、git rev-parse HEAD を使用することができます:

ts
import * as child_process from 'node:child_process';

export default {
	kit: {
		version: {
			name: child_process.execSync('git rev-parse HEAD').toString().trim()
		}
	}
};

バージョンの変更をポーリングするインターバル(ミリ秒)です。これが 0 の場合、ポーリングは発生しません。