Firebase Hosting env variables become undefined after a day

Question

I store my React environmental variables in a .env.production file located in the same folder as package.json. All variables start with REACT_APP_ and function correctly. However, after deploying to Firebase Hosting, these variables become undefined between 7 to 24 hours causing the deployed site to crash unexpectedly.

As a result, the site loads blank with errors due to undefined variables, preventing Firebase initialization. But users in different parts of the world can access it during that window period with no issues and write data to the server.

I attempted to use env-cmd in a build script to incorporate the env.production file during the build and deploy process, but this did not resolve the issue either.

`"scripts": {
    "start": "HTTPS=true SSL_CRT_FILE=./.cert/cert.pem SSL_KEY_FILE=./.cert/key.pem react-scripts start",
    "build": "env-cmd -f .env.production react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
},`

All process.env. become undefined between 7-24hs. My config,js file:

import { initializeApp } from 'firebase/app';
import { getAuth } from 'firebase/auth';
import { getFirestore } from 'firebase/firestore';
import { getMessaging } from 'firebase/messaging';
 const config = {
    apiKey: process.env.REACT_APP_API_KEY,
    projectId: process.env.REACT_APP_PROJECT_ID,
    appId: process.env.REACT_APP_APP_ID,
    messagingSenderId: process.env.REACT_APP_MESSAGIN_SENDER_ID,
    authDomain: process.env.REACT_APP_AUTH_DOMAIN,
    databaseURL: process.env.REACT_APP_DATABASE_URL,
    storageBucket: process.env.REACT_APP_STORAGE_BUCKET,
    measurementId: process.env.REACT_APP_MEASUREMENT_ID,
};

const app = initializeApp(config);
const messaging = getMessaging(app);
const db = getFirestore(app);
const auth = getAuth(app);


export { auth, db, messaging };

I want the deployed firebase site to work consistently. Any solution?