Change Default Path of .env files in Reactjs

Question

I want to setup development & production environment in ReactJs I have created two files .env.production & .env.development in root

Structure looks like below

root
   |
   .env.production
   .env.development

I want to change this to

 root
       |
       enviroments
                  |
                  .env.production
                  .env.development

In simple words i want to change the default location of .env files in react js. How can i do that please help.

Thanks, Is there any way to do this from webpack, so that it can pick environment folder directly, just like it pics from the root directory? — Nishant Singh
– Nishant Singh, Commented Jul 6, 2020 at 11:10

Nishant Singh · Accepted Answer · 2020-07-06 11:23:04Z

1

I found the solution after some research, but for this we need to eject

After eject

change following configuration in config/paths.js

dotenv: resolveApp('.env')

to

dotenv: resolveApp('environments/.env')

answered Jul 6, 2020 at 11:23

Nishant Singh

1,4441 gold badge14 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Mohammed Abu-Saman · Accepted Answer · 2021-12-29 09:19:46Z

1

The easiest way is to use env-cmd for that

npm i env-cmd

and update your package.json file scripts to look like this:

"scripts": {
    "start": "env-cmd -f ../.env  react-scripts start" // replace "../.env" with your relative path
}

answered Dec 29, 2021 at 9:19

252 bronze badges