Claude Code Webでブランチをマージする方法

Claude Code on the Web は便利だが、権限の関係で git push はできても ブランチのマージができないという制限がある。

このサイトは main ブランチにマージしないと Vercel がデプロイしてくれない。つまり web だけで作業を完結できない。

この問題を解決するのが gh-setup-hooks というツール。

gh-setup-hooks とは

Claude Code web のセッション開始時に GitHub CLI（gh）を自動インストールするツール。

• リポジトリ: https://github.com/oikon48/gh-setup-hooks
• SessionStart フックで自動実行
• GH_TOKEN 環境変数で認証

これにより gh pr merge コマンドが使えるようになり、web 上でブランチマージが可能になる。

セットアップ手順

1. プロジェクトにフック設定を追加

.claude/settings.json を作成:

{
  "hooks": {
    "SessionStart": [
      {
        "hooks": [
          {
            "type": "command",
            "command": "npx -y gh-setup-hooks",
            "timeout": 120
          }
        ]
      }
    ]
  }
}

このファイルをコミットしてプッシュしておく。

2. GitHub Personal Access Token を作成

1. https://github.com/settings/tokens にアクセス
2. Generate new token → Generate new token (classic)
3. 設定:
   • Note: Claude Code web など分かりやすい名前
   • Expiration: 90 days（または No expiration）
   • Scopes: repo にチェック（必須）
4. Generate token をクリック
5. 表示されたトークンをコピー（この画面を閉じると二度と表示されない）

3. Claude Code web に環境変数を設定

1. https://claude.ai で Claude Code セッションを開く
2. Settings（歯車アイコン）→ Update cloud environment
3. 環境変数を追加:
   • GH_TOKEN=ghp_xxxxxxxxxxxxx（作成したトークン）
4. 保存

4. 動作確認

新しい web セッションを開始して以下を実行:

gh --version
gh auth status

gh auth status で認証済みと表示されれば成功。

使い方

PR を作成してマージ

# ブランチを作成して変更をプッシュ
git checkout -b feature/new-article
git add .
git commit -m "記事追加"
git push -u origin feature/new-article

# PR を作成
gh pr create --title "記事追加" --body "新しい記事を追加"

# PR をマージ（main にデプロイ）
gh pr merge --merge

# ブランチ削除も同時に行う場合
gh pr merge --merge --delete-branch

main にマージされると Vercel が自動でデプロイを開始する。

おまけ: Claude Code のローカル・Web 連携機能

Claude Code にはテレポート機能があり、ローカルと web 間でセッションを移動できる。

ローカル → Web（& プレフィックス）

ターミナル版 Claude Code で & を付けると、タスクを web に送れる:

& この記事をレビューして修正して

• 新しい web セッションが作成される
• 現在の会話コンテキストが引き継がれる
• ローカル PC を閉じても実行が継続

Web → ローカル（テレポート）

/teleport
# または
claude --teleport

web セッションをローカルに引き戻して作業を継続できる。

注意点

• & は VSCode 拡張版では使えない（CLI 版のみ）
• テレポートは一方向（web → ローカルのみ、ローカル → web の直接転送は不可）
• 同一リポジトリからのみテレポート可能

まとめ

gh-setup-hooks を使えば Claude Code web 上で:

1. 記事を作成
2. ブランチにプッシュ
3. PR を作成
4. main にマージ
5. Vercel が自動デプロイ

という流れが完結する。ローカル環境がなくても、スマホや別の PC から記事を公開できるようになった。

実際に試してみた

この記事自体を使って、ローカル → web → マージの流れを検証した。

1. ローカルから web へセッションを引き継ぐ

ターミナル版 Claude Code で以下を実行:

& gh auth status を実行して、gh CLIがセットアップされているか確認して

web セッションが作成され、会話コンテキストが引き継がれた。

2. PR を作ろうとしたら…

web 上で gh pr create を試みたところ、エラーが発生:

No commits between main and claude/check-gh-auth-RKZpu

調べてみると、ローカルで VSCode 版の Claude Code が先に main へマージしていた。ブランチと main が同じコミットを指していたため、PR を作成できなかった。

3. この追記で再挑戦

そこで、この「実際に試してみた」セクションを追記し、新しいブランチで PR → マージを試すことにした。

# 新しいブランチを作成
git checkout -b claude/gh-merge-test-xxx

# 変更をコミット
git add .
git commit -m "記事更新: 実際に試してみたセクションを追加"

# プッシュ
git push -u origin claude/gh-merge-test-xxx

# PR 作成
gh pr create --repo hide3tu/LiltingChannelWeb \
  --title "記事更新: gh-setup-hooks の実証セクション追加" \
  --body "実際に試してみた結果を追記" \
  --base main

# マージ
gh pr merge --repo hide3tu/LiltingChannelWeb --merge

結果: 成功。web 上から main へのマージが完了し、Vercel が自動デプロイを開始した。