Vercel Build Fails: NEXT_PUBLIC_ variable is `undefined`

Hello Vercel Community,

I’m facing a persistent build issue with my Next.js (App Router) project where an environment variable is consistently undefined during the Vercel build process, even though it is correctly set in the project settings.

The Problem:

My application uses a public environment variable named NEXT_PUBLIC_MY_SERVICE_CLIENT_ID. The build fails every time with an error Error: clientId must be provided because process.env.NEXT_PUBLIC_MY_SERVICE_CLIENT_ID is undefined.

Here’s what I’ve confirmed:

  1. The application runs perfectly on my local machine, correctly loading the variable from my .env.local file.
  2. The environment variable NEXT_PUBLIC_MY_SERVICE_CLIENT_ID is correctly set in the Vercel project settings for all environments (Production, Preview, and Development). I have double-checked for any typos or extra spaces.

Key Debugging Step:

To diagnose this, I added a console.log to the top of my next.config.ts file to print the variable during the build:
console.log('Client ID:', process.env.NEXT_PUBLIC_MY_SERVICE_CLIENT_ID);

Here are the results:

  • Local Machine (npm run dev): The console correctly prints Client ID: my-client-id-value.
  • Vercel Build Log: The console prints Client ID: undefined.

This definitively proves that the variable set in the Vercel UI is not being passed to the build container. I have tried multiple redeploys and new deployments via Git push with the same result.

Here is the relevant part of my build log:

My Question:

Has anyone encountered a situation like this before? Is there a known issue or an additional configuration step I might be missing that would cause a correctly set environment variable to be undefined during the build?

Any help or insight would be greatly appreciated. Thank you!

maybe try defining them in the next.config.ts like this: https://stackoverflow.com/a/68189283?

1 Like

Environment variables can exist at the team level (for sharing between projects) or the project level. Make sure you’ve added or linked it to the proper project.

2 Likes

Hello everyone,

Thank you for looking into this. I wanted to close the loop and report that I have solved the issue.

The problem was 100% user error on my side.

While the environment variable name (NEXT_PUBLIC_...) was correct, the value I was providing was wrong. I was using a human-readable “Marketplace Name” (e.g., my-app-name) from my service provider, but their SDK actually expected a technical UUID (e.g., 123e4567-e89b-12d3-a456-426614174000) for the Client ID.

This incorrect value format is likely what caused the service’s SDK to fail its internal validation, leading to the clientId must be provided error during the Vercel build.

After I updated the environment variable’s value to the correct UUID in my Vercel project settings, the build passed immediately.

Apologies for the confusion, and I hope this helps someone else who might make a similar mistake in the future!

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.