Question

135

.env file not updating in local environment in react js

rated 0 times [ 137] [ 2] / answers: 1 / hits: 7807 / 3 Years ago, fri, september 17, 2021, 12:00:00

I do have a .env file in my react project and using dotenv package to read the environment variables. I did a console log of the environment variables. I had initialized few variables in the beginning in .env file and was being read perfectly.

Later I changed some data in the .env file and restarted the local server, but new changes were not being reflected. EVEN after deleting the .env file and starting the server, the same old variables are loaded.
I know it's a cache issue but could not figure out a way to reset it.

I am using npm start command to start the server.

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

michaelashelbieh

Add To Favorites

Follow

Total Points: 303

Total Questions: 139

Total Answers: 97

Location: Suriname

Member since Sun, Oct 17, 2021

3 Years ago

michaelashelbieh questions

1 Nuxt 3 - resolver.resolveModule is not a function

Sat, Nov 13, 21, 00:00, 3 Years ago

1 How do i pass more things on getServerSideProps() in Next.js

Tue, Sep 14, 21, 00:00, 3 Years ago

1 TypeError: Cannot read property 'split' of undefined in discord and nodejs

Sun, Jan 17, 21, 00:00, 3 Years ago

1 Bootstrap Accordion rotate icon when open

Mon, Aug 31, 20, 00:00, 4 Years ago

1 How to flatten an object with nested objects in javascript

Mon, Apr 20, 20, 00:00, 4 Years ago

View All

answered 3 Years ago yvettel · Accepted Answer

Use REACT_APP prefix

You need to declare variables with REACT_APP prefix as per the documentation.

REACT_APP_API_KEY = 'XXXXXXXX'

REACT_APP_AUTH_DOMAIN = 'XXXXXXXX'

REACT_APP_DATABASE_URL = 'XXXXXXXX'

REACT_APP_PROJECT_ID = 'XXXXXXXX'

REACT_APP_STORAGE_BUCKET = 'XXXXXXXX'

REACT_APP_MESSAGING_SENDER_ID = 'XXXXXXXX'

REACT_APP_API_ID = 'XXXXXXXX'

REACT_APP_MEASUREMENT_ID = 'XXXXXXXX'

And similarly, access them with the prefix in your code

console.log(process.env.REACT_APP_PROJECT_ID);

Note: You need to restart the dev server every time you update the env file to consume the changes.