CODEWITHSUNDEEP
reactjs
Nicklandreth
Nicklandreth

Reputation: 45

Cant access environmental variables React

I am trying to make my login re-usable by storing enviromental variables in .env.local. However whenever I try to call these variables I get undefined.

here is my .env.local file

REACT_APP_AMARBIS_API_KEY = classified
REACT_APP_AMARBIS_AUTH_DOMAIN = classified
REACT_APP_AMARBIS_FIREBASE_PROJECT_ID = classified
REACT_APP_AMARBIS_STORAGE_BUCKET = classified
REACT_APP_AMARBIS_MESSAGING_SENDER_ID = classified
REACT_APP_AMARBIS_APP_ID = classified

and here is where I am trying to access them

import firebase from 'firebase/app'
import "firebase/auth"

const app = firebase.initializeApp({
    apiKey: process.env.REACT_APP_API_KEY,
    authDomain: process.env.REACT_APP_AMARBIS_AUTH_DOMAIN,
    projectId: process.env.REACT_APP_AMARBIS_FIREBASE_PROJECT_ID,
    storageBucket: process.env.REACT_APP_AMARBIS_STORAGE_BUCKET,
    messagingSenderId: process.env.REACT_APP_AMARBIS_MESSAGING_SENDER_ID,
    appId: process.env.REACT_APP_AMARBIS_APP_ID
})

export const auth = app.auth()
export default app

Upvotes: 0

Views: 53

Answers (2)

Nicklandreth
Nicklandreth

Reputation: 45

So I think the problem was that I couldnt change these during a run and all references to them had to be set during startup.

Upvotes: 0

CoderLean
CoderLean

Reputation: 232

You'll need to stop your development server and re-run it using npm start. Each time you update your .env file, you'd need to do this, else you'll get undefined when you try to use the environment variables in your project

Upvotes: 3

Related Questions