Las variables ambientales no funcionan en el navegador en Next.js después de la implementación

En mi v.13.1.1aplicación Next.js encontré un problema con las variables env que funcionan solo localmente. El flujo es

1. Abra la aplicación en VS Code y comience a trabajar
2. Si cambio algún archivo .env, cierro y vuelvo a abrir VS Code
3. Cambie el número de versión de la aplicación en el archivo .head. Haga una confirmación y envíelo a GitHub, que está vinculado a Vercel.
4. Abra el navegador, verifique si la aplicación está cargada con el número de versión actualizado y mire la consola para ver si hay algo desconectado.

El código es .env.local

NEXT_PUBLIC_WEB_CLIENT_ID=2341-2a29v1i7ov6.apps.googleusercontent.com

Ahora dos archivos que no sé si son necesarios o no, solo seguí la respuesta de alguien.

.env.producción

NEXT_PUBLIC_WEB_CLIENT_ID=2341-2a29v1i7ov6.apps.googleusercontent.com

.env.desarrollo

NEXT_PUBLIC_WEB_CLIENT_ID=2341-2a29v1i7ov6.apps.googleusercontent.com

Como dije, no sé si lo necesita o no, lo mismo ocurre con el siguiente archivo:

siguiente.config.js

 @type {import('next').NextConfig} 
const nextConfig = {
    reactStrictMode: true,
    images: { domains: ["images.unsplash.com", "wembleypark.com"] },
    env: {
        WEB_CLIENT_ID: process.env.WEB_CLIENT_ID,
    },
};

module.exports = nextConfig;

Aquí es donde consumo variables: _app.tsx

process.env.NEXT_PUBLIC_WEB_CLIENT_ID && console.log("next webclientid", process.env.NEXT_PUBLIC_WEB_CLIENT_ID);
    process.env.NEXT_PUBLIC_ADMIN_DATA && console.log("next admin", process.env.NEXT_PUBLIC_ADMIN_DATA);
    process.env.WEB_CLIENT_ID && console.log("webclientid", process.env.WEB_CLIENT_ID);

    return (
        <GoogleOAuthProvider clientId={process.env.NEXT_PUBLIC_WEB_CLIENT_ID as string}>
...

Quizás el código sea redundante, pero revisé algunos hilos similares y apliqué la mayoría de las soluciones, sin embargo, nada funciona.

También sospecho que podría ser un problema de confirmación/push/git. GitIgnore previene los archivos .env. Sólo tengo una idea limitada de cómo funciona la construcción. Podría intentar presionar sin restricciones de GitIgnore, pero ¿y después? Estos no deben quedar expuestos. Sí, puedo eliminarlos de GHPages inmediatamente después de la compilación (con suerte, exitosa). ¿Pero debería repetir lo mismo después de cada modificación de código y confirmación/empuje?

¿Alguien podría ayudarme?

Feb 16 '24 18:02 Kiszuriwalilibori