React: Firebase Config File Doesn't Work With Environment Variables

// For Firebase JS SDK v7.20.0 and later, measurementId is optional
const firebaseConfig = {
  apiKey: process.env.API_KEY,
  authDomain: process.env.AUTH_DOMAIN,
  projectId: process.env.PROJECT_ID,
  storageBucket: process.env.STORAGE_BUCKET,
  messagingSenderId: process.env.MESSAGING_SENDER_ID,
  appId: process.env.APP_ID,
  measurementId: process.env.MEASUREMENT_ID,
};

const app = initializeApp(firebaseConfig);

const auth = getAuth();
const db = getFirestore();

// rest of my code, being primarily functions such as `signInWithGoogle` is written here below but are irrelevant to this question

When I originally had all of the variables under firebaseConfig in their string forms, this worked. However, when I switched them out for these environment variables it no longer did and showed the following error:

The thing is, that I've used this same .env file for my MongoDB config file as such:

const uri = process.env.DB_URI;

This is what my .env file looks like:

DB_URI="[censored]"
API_KEY="[censored]"
AUTH_DOMAIN="[censored]"
PROJECT_ID="[censored]"
STORAGE_BUCKET="[censored]"
MESSAGE_SENDER_ID="[censored]"
APP_ID="[censored]"
MEASUREMENT_ID="[censored]"

My application with Firebase authentication was working until I wanted to make it so none of my files had to be gitignored by replacing strings in the firebase config file I have with these environment variables