API

cloudflare プラグインは、Vite の plugins 配列に含めます。

import { defineConfig } from "vite";
import { cloudflare } from "@cloudflare/vite-plugin";

export default defineConfig({
	plugins: [cloudflare()],
});

任意の PluginConfig パラメーターを受け取れます。

• configPath string optional

  エントリ Worker の設定ファイルへの任意のパスです。

  エントリ Worker では、プラグインは次の順で設定パスを解決します。

  1. configPath
  2. CLOUDFLARE_VITE_WRANGLER_CONFIG_PATH（通常はフレームワークや外部ツールが設定します）
  3. アプリケーションルートの wrangler.jsonc、wrangler.json、または wrangler.toml

  これは vite dev と vite build の両方に適用されます。

  Worker 設定の詳細は 設定 を参照してください。

• config WorkerConfigCustomizer<true> optional

  Worker 設定をプログラムからカスタマイズまたは上書きします。 部分的な設定オブジェクト、または現在の設定を受け取る関数を渡せます。

  設定ファイルの読み込み後に適用されます。値の上書き、既存設定の変更、コードだけで Worker を定義するときに使います。

  詳細は プログラムによる設定 を参照してください。

• viteEnvironment { name?: string; childEnvironments?: string[] } optional

  任意の Vite 環境オプションです。 既定では、環境名は Worker 名の - を _ に置き換えたものです。 ここで名前を設定すると、この既定を上書きします。 よくある用途は、viteEnvironment: { name: "ssr" } を設定して、Worker を SSR 環境に適用することです。

  childEnvironments オプションは、@vitejs/plugin-rsc ↗ と、それを土台にしたフレームワーク経由の React Server Components をサポートするためのものです。 1 つの Worker 内に、モジュールグラフが分かれた追加環境を埋め込めます。

  詳細は Vite 環境 を参照してください。

• persistState boolean | { path: string } optional

  状態の永続化を上書きする任意の設定です。 既定では、状態は .wrangler/state に永続化されます。 任意の path を指定できます。値を false にすると、永続化を無効にできます。

• inspectorPort number | false optional

  Workers のデバッグを上書きする任意の設定です。 既定では、デバッグインスペクターは有効で、ポート 9229 で待ち受けます。 任意のポートを指定できます。false にすると、デバッグインスペクターを無効にします。

  詳細は デバッグ を参照してください。

• tunnel boolean | { name?: string; autoStart?: boolean } optional

  ローカルの開発サーバーを Cloudflare Tunnel 経由で公開します。

  名前付きトンネルを設定したり、トンネルの自動起動を制御したりするには、オブジェクトを渡します。t + Enter でトンネルを開始または終了します。Vite 起動時にトンネルを開きたい場合は、tunnel.autoStart を true にします。

  import { defineConfig } from "vite";
  import { cloudflare } from "@cloudflare/vite-plugin";
  
  export default defineConfig({
  	plugins: [
  		cloudflare({
  			tunnel: { name: "my-tunnel" },
  		}),
  	],
  });

  import { defineConfig } from "vite";
  import { cloudflare } from "@cloudflare/vite-plugin";
  
  export default defineConfig({
  	plugins: [
  		cloudflare({
  			tunnel: { name: "my-tunnel" },
  		}),
  	],
  });

  詳細は ローカルの開発サーバーを共有する を参照してください。

• auxiliaryWorkers Array<AuxiliaryWorkerConfig> optional

  補助 Worker の任意の配列です。 補助 Worker は、アプリケーションの一部として使う追加の Worker です。 サービスバインディング を使い、メイン（エントリ）Worker から補助 Worker を呼び出せます。 すべてのリクエストはエントリ Worker を経由します。 ビルド時、各 Worker は dist の別サブディレクトリに出力されます。

• remoteBindings boolean optional

  リモートバインディング を有効にするかどうかです。既定値は true です。

補助 Worker には configPath、config オプション、またはその両方のいずれかが必要です。 CLOUDFLARE_VITE_WRANGLER_CONFIG_PATH はエントリ Worker にのみ適用されます。補助 Worker はこの環境変数を使いません。補助 Worker で設定ファイルを使う場合は、configPath を明示的に設定します。

• configPath string optional

  Worker 設定ファイルへのパスです。 config を指定しない場合、このフィールドは必須です。

  Worker 設定の詳細は 設定 を参照してください。

• config WorkerConfigCustomizer<false> optional

  Worker 設定をプログラムからカスタマイズまたは上書きします。 configPath なしで使うと、補助 Worker をコードだけで定義できます。

  使用例は プログラムによる設定 を参照してください。

• viteEnvironment { name?: string; childEnvironments?: string[] } optional

  任意の Vite 環境オプションです。 既定では、環境名は Worker 名の - を _ に置き換えたものです。 ここで名前を設定すると、この既定を上書きします。

  childEnvironments オプションは、@vitejs/plugin-rsc ↗ と、それを土台にしたフレームワーク経由の React Server Components をサポートするためのものです。 1 つの Worker 内に、モジュールグラフが分かれた追加環境を埋め込めます。

  詳細は Vite 環境 を参照してください。