NEXT_PUBLIC_ inlines a secret at build time

Symptom

A key was added as NEXT_PUBLIC_ so a client component could read it. The production bundle contains the value.

Root cause

Next.js documents that only variables prefixed with NEXT_PUBLIC_ are inlined into the browser bundle, at build time, replacing process.env.NEXT_PUBLIC_... with the literal value. Other variables stay on the server. v0's integration notes say its Vars panel stores a key for server code, and that the key must not be used in a client component. The same notes say the Vars panel writes to all Vercel environments by default, so a live key can land on preview deployments unless you scope it in the Vercel dashboard.

In this Next.js project only:

1. List every NEXT_PUBLIC_ variable. Remove the prefix from anything that is a secret.
2. Move the call that needs the secret into a Route Handler or Server Action. Read process.env.SECRET_NAME only there.
3. If this project is on v0, set production and preview values separately in the Vercel project's environment settings instead of one shared Vars entry.
4. Redeploy. NEXT_PUBLIC_ values are frozen at build time, so a dashboard edit does not update an existing deployment until you rebuild.

Do not print secret values.

Paste this into the coding tool that has your own project open.

2-minute self-check

These steps are for an app you own. Do not run them against someone else's project.

1. Search your own repo for NEXT_PUBLIC_. Each one should be a value you are willing to show a visitor.
2. Open your own deployed site, view source, and search for a secret you know. It should not appear.
3. In the Vercel project for your own app, confirm the live secret is not attached to Preview.

Sources

• Next.js: Environment variables
• v0 environment variables (Firma guide)