Environment variable not found

Tu app necesita un dato de configuración (una dirección, una clave, un identificador) y ha ido a buscarlo donde debería estar guardado. No estaba. Se para ahí, antes de intentar nada más.

Ya de paso: ¿tu app está exponiendo datos?

Analízala gratis mientras lees. Tarda treinta segundos y no toca nada.

Solo leemos lo que tu app ya le entrega a cualquier visitante.

Por qué te pasa

El caso base es siempre el mismo: en tu ordenador esa variable vive en un fichero que no se sube al publicar, a propósito, porque suele contener credenciales. El sitio donde corre tu app publicada no tiene ese fichero, así que hay que darle las variables a mano en su panel.

Cuando ya las diste de alta y sigue fallando, mira estas cuatro por orden. La primera y más común: no volviste a desplegar. Las variables se leen al construir la app, así que un despliegue anterior nunca las va a recoger. La segunda: la diste de alta solo en un entorno, y la app falla en las previsualizaciones aunque vaya bien en producción, o al revés. La tercera: el nombre no coincide exactamente, y basta un guion bajo de más o una letra distinta. La cuarta: la variable la necesita el navegador y no lleva el prefijo VITE_ o NEXT_PUBLIC_, así que existe en el servidor pero no llega hasta donde se usa.

Y una quinta que despista mucho: que estés dando de alta las variables en Vercel pero quien construye tu app sea Lovable, Bolt o Replit. Si publicas desde ahí, las variables van en el panel de esa herramienta y las de Vercel no las ve nadie.

Lo que este error no significa

No has perdido nada ni has roto nada. Es un dato de configuración que falta en un sitio concreto; el código está intacto y funciona en cuanto lo encuentra.
No significa que la variable se haya borrado sola. Casi siempre nunca llegó a estar en ese entorno, aunque tú la vieras funcionando en otro.
No hace falta escribir el valor directamente en el código para salir del paso. Es la tentación del momento y crea un problema mayor: si ese valor es un secreto, acabas de publicarlo.

Arréglalo tú, gratis

Todo en paneles, sin tocar código. El orden importa porque cada paso descarta una causa y evita que redespliegues cinco veces a ciegas.

1Averigua el nombre exacto que falta. El propio mensaje de error suele decirlo; si no, míralo en el fichero de configuración local del proyecto. Cópialo tal cual, con sus mayúsculas y sus guiones bajos.
2Identifica quién construye tu app de verdad. Si publicas desde Vercel o Netlify, es su panel. Si publicas desde el botón de Lovable, Bolt o Replit, es el panel de esa herramienta. Meter la variable en el sitio equivocado es la causa más frustrante porque parece que ya lo has hecho.
3Da de alta la variable con el nombre exacto y marca todos los entornos que te ofrezca, no solo producción.
4Decide si esa variable la necesita el navegador o el servidor. Si es una dirección pública o una clave pública, necesita el prefijo VITE_ o NEXT_PUBLIC_ según tu proyecto. Si es un secreto, no debe llevarlo bajo ningún concepto.
5Vuelve a desplegar y comprueba. Si tu panel te deja ver el registro del despliegue, busca ahí el nombre de la variable: si no aparece, no le está llegando y el problema sigue siendo de configuración, no de código.

Si el error solo aparece en las previsualizaciones y no en producción, no busques más: es que la variable está dada de alta solo para producción.

Y esto para la parte de código

Pégaselo tal cual al agente que escribió tu app. Está redactado para que te diga lo que ha hecho, no solo para que lo haga.

Prompt para pegarle a tu agente

Mi app da el error "Environment variable not found" al desplegarla.

Necesito que hagas esto:
1. Recorre el proyecto y hazme la lista completa de variables de entorno que se leen, con el nombre exacto de cada una y para qué sirve.
2. Separa esa lista en dos: las que necesita el navegador (y por tanto llevan prefijo VITE_ o NEXT_PUBLIC_) y las que solo debe conocer el servidor.
3. Si alguna credencial que debería ser secreta está en el primer grupo, dímelo de forma destacada: eso no es solo un error de configuración, es una filtración.
4. Añade al arranque de la app una comprobación que verifique que están todas las que necesita y que falle diciendo por su nombre cuál falta, en vez de un mensaje genérico.
5. Actualiza el fichero .env.example con la lista completa y un comentario por variable.

Al terminar, dame la lista literal de nombres que tengo que dar de alta en el panel, sin valores.

¿Lo has intentado y sigue sin salir?

O el escáner de arriba ha encontrado algo y prefieres no tocarlo solo. En cualquiera de los dos casos esto ya es de los gordos y merece un humano: no es que no hayas sabido, es que has llegado al punto en que hace falta alguien que entre y lo vea por dentro.

Cita a partir de mañana

Agendar revisión

99 €

Elegimos hueco, miro tu app con calma y te digo qué pasa y cómo se arregla.

Sesión de trabajo en directo contigo
Diagnóstico del error y del riesgo real
Te quedas con el arreglo aplicado

Ver huecos disponibles

Hoy, en cola prioritaria

Rescate exprés

199 €

Entras en la cola de hoy. Reservas hueco y lo dejamos resuelto en el día.

Hueco el mismo día
Prioridad sobre las revisiones agendadas
Mismo trabajo, antes

Ver huecos de hoy

Quién lo arregla

Marc Sala

IT Manager

Analista de ciberseguridad certificado por Google

No es un rating anónimo de un marketplace: es la persona que va a entrar en tu app. Reviso el código, encuentro qué falla y lo arreglo contigo delante.