72

I used a create-react-app.

And created environment variable files. .env.local, .env.development.local

I found that .env.development ispreferred over .env.local

And env.development.local seems to have prioty over .env.development.

If so, .env.development.local is used to override .env.development what is the purpose of .env.local?

pyyyyysv
  • 797
  • 2
  • 6
  • 7

2 Answers2

130

Here's the priority of the files for the development build and the production build:

Dev.: (npm start): .env.development.local, .env.local, .env.development, .env

Prod.: (npm run build): .env.production.local, .env.local, .env.production, .env

If you ever want to use something in your local environment without being specific to the development build or the production build, you can add some variables to your .env.local file.

Source : https://create-react-app.dev/docs/adding-custom-environment-variables/#what-other-env-files-can-be-used

jb-
  • 3
  • 1
Clafouti
  • 4,035
  • 5
  • 30
  • 38
63

In .env.local you can set up environment variables that are specific to your local machine and it doesn't have to be on development mode to work, so variables there will work for both development and production.

r g
  • 3,586
  • 1
  • 11
  • 27
  • 2
    how do i load .env.local with require('dotenv')? – chovy Jan 05 '20 at 18:39
  • 1
    @chovy tbh i prefer `dotenv-flow`, then just `require('dotenv-flow').config(); const url = process.env.DB;` – r g Jan 09 '20 at 16:42
  • 1
    @chovy I don't think there's a concept of override in `dotenv` as specified by [this issue](https://github.com/motdotla/dotenv/issues/199). But if you just want to load `.env.local` from `dotenv` then you can pass it in config as mentioned [here](https://github.com/motdotla/dotenv#path). – shriek Feb 14 '21 at 19:05