GitHub Actions - Vercel Workflow

preview.yml

name: Preview Deployment

on:
  pull_request:
    branches: [ main ]

env:
  VERCEL_ORG_ID: ${{ secrets.VERCEL_ORG_ID }}

jobs:
  deploy:
    runs-on: ubuntu-latest

    env:
      VERCEL_PROJECT_ID: ${{ secrets.VERCEL_PROJECT_ID }}

    environment:
      name: App Preview
      url: ${{ steps.deploy.outputs.PREVIEW_URL }}

    outputs:
      PREVIEW_URL: ${{ steps.deploy.outputs.PREVIEW_URL }}

    steps:
      - uses: actions/checkout@v3
      - name: Install Vercel CLI
        run: npm install --global vercel@latest
      - name: Pull Vercel Environment Information
        run: vercel pull --yes --environment=preview --token=${{ secrets.VERCEL_TOKEN }}
      - name: Build Project Artifacts
        run: vercel build --token=${{ secrets.VERCEL_TOKEN }}
      - name: Deploy Project Artifacts to Vercel
        id: deploy
        run: echo "PREVIEW_URL=$(vercel deploy --prebuilt --token=${{ secrets.VERCEL_TOKEN }})" >> "$GITHUB_OUTPUT"

  add_comment:
    runs-on: ubuntu-latest

    needs: [deploy]

    steps:
      - name: Add comment to PR
        uses: mshick/add-pr-comment@v2
        env:
          PREVIEW_URL: ${{ needs.deploy.outputs.PREVIEW_URL }}
        with:
          message: |
            ## 🚀 Preview Deployment
            
            You can view a preview of this branch at the following URL:
            ${{ needs.deploy.outputs.PREVIEW_URL }}

production.yml

name: Production Deployment

on:
  push:
    branches: [ main ]

env:
  VERCEL_ORG_ID: ${{ secrets.VERCEL_ORG_ID }}

jobs:
  deploy:
    runs-on: ubuntu-latest

    env:
      VERCEL_PROJECT_ID: ${{ secrets.VERCEL_PROJECT_ID }}

    environment:
      name: App Production
      url: ${{ steps.deploy.outputs.PREVIEW_URL }}

    steps:
      - uses: actions/checkout@v3
      - name: Install Vercel CLI
        run: npm install --global vercel@latest
      - name: Pull Vercel Environment Information
        run: vercel pull --yes --environment=production --token=${{ secrets.VERCEL_TOKEN }}
      - name: Build Project Artifacts
        run: vercel build --prod --token=${{ secrets.VERCEL_TOKEN }}
      - name: Deploy Project Artifacts to Vercel
        run: echo "PREVIEW_URL=$(vercel deploy --prebuilt --prod --token=${{ secrets.VERCEL_TOKEN }})" >> "$GITHUB_OUTPUT"