ゼロから始める

このガイドでは、新しい Workers Sites プロジェクトをゼロからすばやく始めます。

1. 最新版の git ↗ と Node.js ↗ をインストールしておきます。

2. ターミナルで、スターターリポジトリ worker-sites-template をクローンします。 次の例では、my-site というプロジェクトを作成します。

   git clone --depth=1 --branch=wrangler2 https://github.com/cloudflare/worker-sites-template my-site

3. npm install を実行して、依存関係をすべてインストールします。

4. wrangler dev コマンドでサイトをプレビューできます。

   wrangler dev

5. サイトを Cloudflare にデプロイします。

   npx wrangler deploy

テンプレートには、次のファイルとディレクトリが含まれます。

• public: プロジェクトの静的アセットです。初期状態では index.html と favicon.ico があります。
• src: アセット配信用に設定された Worker です。編集は必須ではありません。仕組みを確認したり、機能を追加したりする場合は src/index.ts を編集できます。
• wrangler.jsonc: プロジェクト設定を含むファイルです。 bucket プロパティで、静的アセットの場所を Wrangler に伝えます（例: site = { bucket = "./public" }）。
• package.json / package-lock.json: 必要な Node.js の依存関係を定義します。

• name プロパティをプロジェクト名に変更します。

  {
    "$schema": "./node_modules/wrangler/config-schema.json",
    "name": "my-site"
  }

  "$schema" = "./node_modules/wrangler/config-schema.json"
  name = "my-site"

• 最新の Workers 機能を使うため、compatibility_date を今日の日付に更新することを検討してください。

  {
    "compatibility_date": "yyyy-mm-dd"
  }

  compatibility_date = "yyyy-mm-dd"

• 所有済みで、Cloudflare ゾーンとしてすでに追加している カスタムドメイン にサイトをデプロイします。

  {
    "route": "https://example.com/*"
  }

  route = "https://example.com/*"

プロジェクトの 設定方法 について、さらに詳しく学べます。