Cloudflare Pagesに静的サイトをデプロイする手順

2026-03-11

Wrangler CLIを使って、HTMLファイルをCloudflare Pagesに公開する手順です。実際に6分で公開できました。

前提条件

Cloudflareアカウントを持っていること
Node.js がインストール済みであること
Wrangler CLI が使えること（npx wrangler でOK）

手順

1. デプロイ用のディレクトリを作る

公開したいHTMLファイルを格納するディレクトリを作成します。

mkdir cf-site

2. HTMLファイルを配置する

cf-site/index.html を作成します。最小限の例：

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <title>My Site</title>
</head>
<body>
  <h1>Hello, Cloudflare Pages!</h1>
</body>
</html>

3. Cloudflare Pagesプロジェクトを作成する

初回のみ、プロジェクトを作成します。

npx wrangler pages project create my-site --production-branch=main

成功すると https://my-site-xxx.pages.dev/ のようなURLが割り当てられます。

4. デプロイする

npx wrangler pages deploy cf-site --project-name=my-site --branch=main --commit-dirty=true

ポイント：

--branch=main を指定するとプロダクション環境にデプロイされる
--commit-dirty=true はGitリポジトリに未コミット変更がある場合の警告を抑制する
2回目以降は変更されたファイルだけアップロードされるので高速

5. 確認する

デプロイ完了後に表示されるURLにアクセスして、ページが正しく表示されることを確認します。

プロジェクトの削除

不要になったら以下のコマンドで削除できます。

npx wrangler pages project delete my-site

まとめ

Wrangler CLIがあれば、HTMLファイルを用意して 2コマンド（project create + deploy）で公開できます。ビルドツールやフレームワークは不要で、静的ファイルをそのままデプロイできるのがCloudflare Pagesの強みです。