ci: GitHub Actions から Vercel へデプロイする

[ayuki-joto]

概要

#1 の投入面を作る前に、まず Vercel にデプロイできる状態にする。デプロイ経路は GitHub Actions に寄せた。

先に済ませる理由は、Neon などのストレージを Vercel Marketplace から入れる際に「リンク済みの Vercel プロジェクト」へ環境変数が注入される仕組みのため。プロジェクトが無いと DB 側の作業が止まる。

変更内容

Vercel で動く形にする

react-router.config.ts に @vercel/react-router の vercelPreset() を追加した。React Router v7 の SSR を Vercel で動かすには必須で、これが無いとビルド成果物を Vercel が配信できない。

二重デプロイの回避

vercel.json で main の Git 連携デプロイを無効化した。Vercel の Git 連携と Actions を併用すると、同じコミットが 2 回デプロイされる。

{ "git": { "deploymentEnabled": { "main": false } } }

ワークフロー

ファイル	契機	内容
vercel-preview.yml	main 向けの PR	typecheck → vercel build → preview デプロイ → PR に URL をコメント（貼り替え式）
vercel-production.yml	main への push	typecheck → vercel build --prod → production デプロイ

どちらも pnpm typecheck を通してからビルドする。preview は同一 PR への連続 push で古い実行を打ち切る。

Dockerfile の削除

Dockerfile と .dockerignore を削除した。npm ci と package-lock.json を前提にしていたが、このリポジトリは pnpm で pnpm-lock.yaml しか無いため、そのままでは動かない状態だった。テンプレート既定のまま放置されていたもの。

コンテナデプロイを残す方針なら、削除ではなく pnpm 対応に直す形に変更する。

その他

• packageManager: pnpm@10.14.0 を追加（CI で pnpm のバージョンを固定するため）
• .gitignore に /.vercel/ と /.playwright-mcp/ を追加

マージ前に必要な設定

このリポジトリの Secrets に 3 つ登録が必要。未登録のままだとワークフローは失敗する。

Secret	取得元
VERCEL_TOKEN	Vercel の Account Settings → Tokens
VERCEL_ORG_ID	vercel link 後に生成される .vercel/project.json の orgId
VERCEL_PROJECT_ID	同 projectId

手順は、ローカルで vercel link して Vercel プロジェクトを作成 → 生成された .vercel/project.json から 2 つの ID を控える → Vercel でトークンを発行 → 3 つを Secrets に登録。.vercel/ は .gitignore 済みなのでコミットされない。

確認したこと

• pnpm typecheck 成功
• pnpm build 成功。プリセットが効いて build/server/nodejs_<runtime>/ 形式で出力される
• 両ワークフローの YAML パース成功

実際の Vercel デプロイは未検証。Secrets 登録後、この PR の preview ジョブが初回の検証になる。

関連

• 限定公開の投入フォームと、APIコスト上限の仕組みを作る #1

[github-actions]

Preview: https://data-void-visualization-16bo8jh8g-c4j.vercel.app (4147c14)