This action was formerly Zeit Now Deployment. Migration Guide

Vercel is a cloud platform for static sites and Serverless Functions that fits perfectly with your workflow. It enables developers to host Jamstack websites and web services that deploy instantly, scale automatically, and requires no supervision, all with no configuration.

This action make a Vercel deployment with github actions.

• Deploy to Vercel.
• Comment on pull request.
• Comment on commit.
• Password Protect ( Basic Auth )
• Alias domain to deployment.
• Create Deployment on GitHub.

pull request example

commit

These inputs use the @vercel/client API directly instead of the CLI. They are used when vercel-args is not provided.

The url of deployment preview.

The name of deployment name.

The GitHub Deployment ID. Only set when github-deployment is true. Can be used by downstream steps to reference the deployment.

The Vercel for GitHub integration automatically deploys your GitHub projects with Vercel, providing Preview Deployment URLs, and automatic Custom Domain updates. See Git Configuration for more details.

We would like to use github actions for build and deploy instead of Vercel.

Disable automatic deployments by setting git.deploymentEnabled: false in your project configuration.

Install @vercel/config and create a vercel.ts file:

import type { VercelConfig } from '@vercel/config/v1';

export const config: VercelConfig = {
  public: false,
  git: {
    deploymentEnabled: false,
  },
};

{
  "public": false,
  "git": {
    "deploymentEnabled": false
  }
}

Note: The github.enabled property is deprecated. Use git.deploymentEnabled instead. See Turning off all automatic deployments.

Since we do the build in github actions, we don't need to build in vercel.

• Specify "Other" as the framework preset, and
• Enable the Override option for the Build Command, and
• Leave the Build Command empty.
• This will prevent the build from being attempted and serve your content as-is.

See docs for more details

You can override the build command in your project configuration to skip Vercel's build step.

vercel.ts (recommended):

import type { VercelConfig } from '@vercel/config/v1';

export const config: VercelConfig = {
  buildCommand: '',
};

vercel.json:

{
  "buildCommand": ""
}

See Build Command docs and Programmatic Configuration for more details.

You can build your project locally (or in GitHub Actions) using vercel build and upload only the build artifacts to Vercel — without giving Vercel access to the source code. This uses the Build Output API specification.

name: deploy website
on: [pull_request]
jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - 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 }}
        env:
          VERCEL_ORG_ID: ${{ secrets.VERCEL_ORG_ID }}
          VERCEL_PROJECT_ID: ${{ secrets.VERCEL_PROJECT_ID }}
      - name: Build Project Artifacts
        run: vercel build --token=${{ secrets.VERCEL_TOKEN }}
        env:
          VERCEL_ORG_ID: ${{ secrets.VERCEL_ORG_ID }}
          VERCEL_PROJECT_ID: ${{ secrets.VERCEL_PROJECT_ID }}
      - uses: amondnet/vercel-action@v42
        with:
          vercel-token: ${{ secrets.VERCEL_TOKEN }}
          github-token: ${{ secrets.GITHUB_TOKEN }}
          vercel-org-id: ${{ secrets.VERCEL_ORG_ID }}
          vercel-project-id: ${{ secrets.VERCEL_PROJECT_ID }}
          prebuilt: true

See Vercel's official GitHub Actions example for more details.

You should link a project via Vercel CLI in locally.

When running vercel in a directory for the first time, Vercel CLI needs to know which scope and Project you want to deploy your directory to. You can choose to either link an existing project or to create a new one.

NOTE: Project linking requires at least version 17 of Vercel CLI. If you have an earlier version, please update to the latest version.

vercel

? Set up and deploy “~/web/my-lovely-project”? [Y/n] y
? Which scope do you want to deploy to? My Awesome Team
? Link to existing project? [y/N] y
? What’s the name of your existing project? my-lovely-project
🔗 Linked to awesome-team/my-lovely-project (created .vercel and added it to .gitignore)

Once set up, a new .vercel directory will be added to your directory. The .vercel directory contains both the organization(vercel-org-id) and project(vercel-project-id) id of your project.

{ "orgId": "example_org_id", "projectId": "example_project_id" }

You can save both values in the secrets setting in your repository. Read the Official documentation if you want further info on how secrets work on Github.

• This is a complete .github/workflows/deploy.yml example.

Set the vercel-project-id and vercel-org-id you found above.

name: deploy website
on: [pull_request]
jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      #  your build commands
      # - run: |
      #    ng build --prod
      - uses: amondnet/vercel-action@v42 # deploy
        with:
          vercel-token: ${{ secrets.VERCEL_TOKEN }} # Required
          github-token: ${{ secrets.GITHUB_TOKEN }} # Optional
          vercel-args: --prod # Optional
          vercel-org-id: ${{ secrets.ORG_ID}} # Required
          vercel-project-id: ${{ secrets.PROJECT_ID}} # Required
          working-directory: ./sub-directory

See .github/workflows/example-angular.yml ,

How to add Basic Authentication to a Vercel deployment

See .github/workflows/example-express-basic-auth.yml

source code

| @now/node-server is deprecated and stopped working. Use @vercel/node instead. #61

You can assign a domain to this deployment. Please note that this domain must have been configured in the project.

If you want to assign domain to branch or pr, you should add Wildcard Domain.

You can use pull request number via {{PR_NUMBER}} and branch via {{BRANCH}}

Wildcard Domains : *.angular.vercel-action.amond.dev

Per Pull Request

https://pr-{{PR_NUMBER}}.angular.vercel-action.amond.dev

• PR-1 -> https://pr-1.angular.vercel-action.amond.dev
• PR-2 -> https://pr-2.angular.vercel-action.amond.dev

Per Branch

https://{{BRANCH}}.angular.vercel-action.amond.dev

• develop -> https://develop.angular.vercel-action.amond.dev
• master -> https://master.angular.vercel-action.amond.dev
• master -> https://master.angular.vercel-action.amond.dev

See .github/workflows/example-angular.yml

name: deploy website
on: [pull_request]
jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - uses: amondnet/vercel-action@v42
        with:
          vercel-token: ${{ secrets.VERCEL_TOKEN }} # Required
          github-token: ${{ secrets.GITHUB_TOKEN }} # Optional
          vercel-args: --prod # Optional
          vercel-org-id: ${{ secrets.ORG_ID}} # Required
          vercel-project-id: ${{ secrets.PROJECT_ID}} # Required
          working-directory: ./sub-directory # Your Working Directory, Optional
          alias-domains: | # Optional
            staging.angular.vercel-action.amond.dev
            pr-{{PR_NUMBER}}.angular.vercel-action.amond.dev

You can create GitHub Deployments to track your Vercel deployments directly in GitHub's Environments tab.

Set github-deployment to true and provide a github-token with deployments: write permission.

The environment is auto-detected from vercel-args: production when --prod is present, otherwise preview. You can override this with github-deployment-environment.

name: deploy website
on: [pull_request]
jobs:
  deploy:
    runs-on: ubuntu-latest
    permissions:
      deployments: write
    steps:
      - uses: actions/checkout@v2
      - uses: amondnet/vercel-action@v42
        id: vercel
        with:
          vercel-token: ${{ secrets.VERCEL_TOKEN }}
          github-token: ${{ secrets.GITHUB_TOKEN }}
          vercel-org-id: ${{ secrets.ORG_ID}}
          vercel-project-id: ${{ secrets.PROJECT_ID}}
          github-deployment: true
          # github-deployment-environment: staging  # Optional override
      - run: echo "Deployment ID is ${{ steps.vercel.outputs.deployment-id }}"

The deployment lifecycle:

1. A GitHub Deployment is created with status in_progress before the Vercel deploy
2. On success, the status is updated to success with the preview URL
3. On failure, the status is updated to failure
4. Previous deployments to the same environment are automatically deactivated

Note: GitHub Deployment errors are non-blocking. If the GitHub API call fails, the Vercel deployment will still proceed normally.

Starting from v42, the default deployment method has changed from CLI-based (vercel CLI exec) to API-based (@vercel/client programmatic API). This provides faster deployments, typed inputs, and eliminates the need for CLI installation at runtime.

Before (CLI-based):

- uses: amondnet/vercel-action@v42
  with:
    vercel-token: ${{ secrets.VERCEL_TOKEN }}
    github-token: ${{ secrets.GITHUB_TOKEN }}
    vercel-org-id: ${{ secrets.ORG_ID }}
    vercel-project-id: ${{ secrets.PROJECT_ID }}
    vercel-args: --prod --force --env API_URL=https://api.example.com

After (API-based):

- uses: amondnet/vercel-action@v42
  with:
    vercel-token: ${{ secrets.VERCEL_TOKEN }}
    github-token: ${{ secrets.GITHUB_TOKEN }}
    vercel-org-id: ${{ secrets.ORG_ID }}
    vercel-project-id: ${{ secrets.PROJECT_ID }}
    target: production
    force: true
    env: |
      API_URL=https://api.example.com

Before (CLI prebuilt):

- uses: amondnet/vercel-action@v42
  with:
    vercel-token: ${{ secrets.VERCEL_TOKEN }}
    vercel-org-id: ${{ secrets.ORG_ID }}
    vercel-project-id: ${{ secrets.PROJECT_ID }}
    vercel-args: --prebuilt

After (API prebuilt):

- uses: amondnet/vercel-action@v42
  with:
    vercel-token: ${{ secrets.VERCEL_TOKEN }}
    vercel-org-id: ${{ secrets.ORG_ID }}
    vercel-project-id: ${{ secrets.PROJECT_ID }}
    prebuilt: true

The action automatically selects the deployment method:

• vercel-args is empty (default) → API-based deployment using @vercel/client
• vercel-args is provided → CLI-based deployment using vercel CLI (backward compatible)

No changes are required if you are already using vercel-args. Your existing workflows will continue to work as before. To migrate, simply remove vercel-args and use the new typed inputs instead.

These inputs are only available with API-based deployment (when vercel-args is not set):

• auto-assign-custom-domains — Automatically assign custom domains (default: true)
• custom-environment — Custom environment slug or ID
• with-cache — Retain build cache from previous deployments
• vercel-output-dir — Directory containing prebuilt output (only relevant when prebuilt: true)

1. Change action name in workflows from now-deployment to vercel-action

   - name: Vercel Action
     uses: amondnet/vercel-action@v42

2. Change input values.
   • zeit-token -> vercel-token
   • now-org-id -> vercel-org-id
   • now-project-id -> vercel-project-id