こんにちは、マサシです。
自社サイトのGitHubリポジトリを作り直す作業をしたあと、Vercelの本番サイトが固まりました。
コードを直してpushしても、本番にまったく反映されません。
Vercelの管理画面を開くと、連携しているリポジトリの表示がおかしくなっていました。
先に結論を書きます。
この状態は「Reconnect」ボタンでは直りません。
Settings → Git → Disconnect → Connect の順でつなぎ直すのが正解です。
何が起きたか
GitHubのリポジトリを一度削除して、同じ名前で作り直しました。
名前は同じでも、GitHubの内部ではリポジトリごとに番号（ID）が振られています。
この番号が変わったことで、Vercel側は「前のリポジトリと別物」と判断しました。
管理画面でReconnectを押しました。
already linked to a different repository というエラーで止まります。
ここで最初にやったのが、このReconnectボタンを何度か押し直すことでした。
結果は同じエラーの繰り返しで、直りませんでした。
Reconnectを押し続けるのはやめて、別の手順に切り替えました。
直した手順（実際に行った3手順）
Vercelの公式ドキュメントにも、連携を切り替える手順が載っています。
切断してからつなぎ直す、という案内です（出典: Git settings）。
実際に行ったのは次の3手順です。
手順1. Settings → Git → Disconnect
対象プロジェクトのSettingsを開き、Gitのタブで「Disconnect」を押します。
この時点ではデプロイ済みの本番サイトは消えません。
手順2. GitHub → Connect で作り直したリポジトリを選ぶ
「Connect」を押すとGitHub連携の画面に切り替わります。
作り直した側のリポジトリを選び、Root Directoryを元の設定（今回はsites/mstudio）に戻します。
GitHub側のVercelアプリの権限は「All repositories」のままで、個別に権限を足す操作は不要でした。
手順3. CLIで本番ブランチの設定を確認する
画面上は「つながった」ように見えても、本番ブランチの指定が内部的に古いままのことがあります。
vercel project inspect <プロジェクト名> を実行しました。
link.productionBranch が main になっているかを確認しました。
あわせて本番URLにアクセスし、HTTPステータスが200で返ることを確認しました。
公式ドキュメントでは、CLIの vercel git connect でも連携できるとのことです。
出典: vercel git。
実際に確認した数字
この作業では、思い込みで「直った」と判断しないために3つの数字を確認しました。
1つ目は、アカウントに存在するVercelプロジェクトの数です。
今回GitHubと連携していたのは14件のプロジェクトでした。
そのうちGitHub連携が必要だったのは本番サイトの1件だけです。
確認: vercel project ls の出力一覧14件を1件ずつ見て、Connected Git Repositoryの有無を数えました。
API経由で14件すべての連携先を確認し、ほかのプロジェクトに影響が出ていないことを確かめました。
2つ目は、使ったVercel CLIのバージョンです。
手元の環境にはvercel CLIが入っておらず、作業の前にバージョン60.1.3をインストールしました。
CLIのバージョンが古いと、project inspect のオプションが足りないことがあります。
ここも確認対象にしました。
3つ目は、本番URLのHTTPステータスです。
つなぎ直した直後に本番URLへアクセスし、200が返ることを確認しました。
200を確認するまでは「作業完了」にしないという線を引きました。
やめたこと
最初にやって、やめたのは「Reconnectボタンを連打すること」です。
エラーメッセージを読まずに同じボタンを押し直しても、原因は解消されません。
リポジトリの番号が変わったことが原因なので、何度試しても同じ結果でした。
エラー文のalready linked to a different repositoryをそのまま検索しました。
Disconnect→Connectという別の手順があることを確認してから切り替えました。
結果的に、エラー文を先に読んでいれば、ボタン連打の時間は不要でした。
持ち帰りチェックリスト
GitHubリポジトリを作り直した後にVercelの連携を直すときのチェックリストです。
コピーしてそのまま使えます。
- Reconnectで
already linked to a different repositoryが出たら、Reconnectではなく一度Disconnectする - Disconnect後にConnectで、作り直した側のリポジトリを選び直す
- Root Directoryの設定が元のまま残っているかを確認する
-
vercel project inspect <プロジェクト名>でproductionBranchを確認する - 本番URLにアクセスし、HTTPステータス200を確認してから作業完了にする
まとめ
Vercelの管理画面でGit連携がおかしくなったとき、最初に試したくなるのはReconnectボタンです。
ですが、GitHubリポジトリを作り直した直後は前提が変わります。
「内部的な番号が変わった」ケースでは、Reconnectは効きません。
Settings → Git → Disconnectで一度切り、Connectでつなぎ直します。
CLIかAPIで本番ブランチとHTTPステータスを確認する——この3ステップで直りました。
同じ画面で固まった人の参考になれば幸いです。