github actionsからvercelへdeployする（#javascript)

name: Production Deployment
env:
  VERCEL_ORG_ID: ${{ secrets.VERCEL_ORG_ID }}
  VERCEL_PROJECT_ID: ${{ secrets.VERCEL_PROJECT_ID }}
on:
  workflow_dispatch:
jobs:
  Deploy-Production:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout
        uses: actions/checkout@0ad4b8fadaa221de15dcec353f45205ec38ea70b # v4

      - name: Install Vercel CLI
        run: npm install --global vercel@latest
      # - name: Pull Vercel Environment Information
      #   run: vercel pull --yes --environment=production --token=${{ secrets.VERCEL_ACCESS_TOKEN }}
      # - name: Build Project Artifacts
      #   run: vercel build --prod --token=${{ secrets.VERCEL_ACCESS_TOKEN }}
      - name: Deploy Project Artifacts to Vercel
        run: vercel deploy --prod --token=${{ secrets.VERCEL_ACCESS_TOKEN }}

基本的には公式の手順通りにvercel cliインストールしてbuildしてビルド産物を使ってdeployするだけです。

How to Use GitHub Actions to Deploy to Vercel

LearnhowtouseGitHubActionsasyourCI/CDprovidertodeploytoVercel,includingsupportforGitHubEnterpriseServer.

ただし、私の環境（Prisma使用）だと困ったことが発生しました。
Vercelへのdeployは成功し、topページにもアクセスできるのですがDBアクセス時に落ちます。
エラー内容は以下の通り

Unhandled Rejection: PrismaClientInitializationError: Prisma Client could not locate the Query Engine for runtime "rhel-openssl-3.0.x".
This happened because Prisma Client was generated for "debian-openssl-1.1.x", but the actual deployment required "rhel-openssl-3.0.x".
Add "rhel-openssl-3.0.x" to `binaryTargets` in the "schema.prisma" file and run `prisma generate` after saving it:
generator client {
provider      = "prisma-client-js"
binaryTargets = ["native", "rhel-openssl-3.0.x"]
}

これlinux-ubuntuでビルドしてからdeployすると、vercelのedge環境と異なるから動かないとかそういうやつですかね？github actionsではなくvercel内でbuildさせた場合には発生しなかったのでなんで？？？って感じでした。

結局解決方法はエラーに書いてある通りにbinaryTargetsを書き換えるか、
github actionsでビルドはトリガーするけど実際のビルドはvercelでやるかの2択かと思います。

今回は–prebuiltオブションを外してdeployコマンドを叩きます。

vercel deploy --prebuilt
=>　vercel deploy

これに伴ってvercelの環境変数をpullしたり、actions内でbuildする必要がなくなったので、この辺のコードも除去します。

      # - name: Pull Vercel Environment Information
      #   run: vercel pull --yes --environment=production --token=${{ secrets.VERCEL_ACCESS_TOKEN }}
      # - name: Build Project Artifacts
      #   run: vercel build --prod --token=${{ secrets.VERCEL_ACCESS_TOKEN }}

tips

上記のようにbuildをvercelに変更すると、今度はgithub actions内に持たせた環境変数が使えなくなるため、vercelの環境変数に移す必要があります。
常時使う環境変数は移せばいいのですが、staging環境のみで渡したい環境変数などはvercel内の環境変数設定だけだと設定しにくく不便です（特定のgithubブランチに対して環境変数は指定できるが、同一ブランチで複数のdeployを行う場合など。私の場合はmainブランチをproduction/stagingの両方に使う場合です）

なのでこんな感じで –build-envにビルド時に利用する環境変数を渡し、実行環境に利用する環境変数は–envで渡せばこの値を使ってビルド・デプロイしてくれます。

        run: vercel deploy --token=${{ secrets.VERCEL_ACCESS_TOKEN }} --build-env DATABASE_URL=${{ env.DATABASE_URL }} --env DATABASE_URL=${{ env.DATABASE_URL }}