Guides
CI Vercel

Adding CI flow to Vercel applications

This guide should be enough for setting up CI workflow with Vercel If you want more information this is the more (opens in a new tab) comprehensive guide but distilled for our use case are the steps below.

This guide assumes there is an existing Vercel project.

If you do not have an existing vercel project you can create it by running this command. Make sure you have vercel cli installed (opens in a new tab).

vercel project add <project-name>

Create the .gitlab-ci.yml in repository root and paste the following content

default:
  image: node:20.11.1
 
deploy_preview:
  stage: deploy
  except:
    - main
  script:
    - npm install --global vercel
    - vercel pull --yes --environment=preview --token=$VERCEL_TOKEN
    - vercel build --token=$VERCEL_TOKEN
    - vercel deploy --prebuilt  --token=$VERCEL_TOKEN
 
deploy_production:
  stage: deploy
  only:
    - main
  script:
    - npm install --global vercel
    - vercel pull --yes --environment=production --token=$VERCEL_TOKEN
    - vercel build --prod --token=$VERCEL_TOKEN
    - vercel deploy --prebuilt --prod --token=$VERCEL_TOKEN

Retrieve VERCEL_TOKEN

Create the new token here -> Access token (opens in a new tab)

Retrieve VERCEL_PROJECT_ID

Go to general project settings and find the project Id Cerebro project id (opens in a new tab)

Retrieve the VERCEL_ORG_ID

Org id (opens in a new tab)

Set the correct environment variables to Gitlab project.

e.g. for Cerebro Cerebro GitLab project settings (opens in a new tab)

In the VARIABLES section add the following variables with the values you prepared

VERCEL_TOKEN, VERCEL_ORG_ID, VERCEL_PROJECT_ID

Done

Any time you merge to master or create a MR the CI flow will trigger