Q:

.env constants not readable in React project

I have a an issue trying to get constants our of my .env file in a React app. My app structure is pretty basic:
my-react-app/
|- .env
|- .gitignore
|- .prettierrc
|- node-modules/
|- public/
|- src/
   |- Base.js
   |- App.js
|- package.json
|- yarn.lock
|- README.md

I'm using react-scripts version "3.2.0"
The .env looks like this:
# .env
# Auto-logout values
REACT_APP_LOGOUT_PERIOD_MINS=15 

and the Base.js file looks like this:
require('dotenv').config({ path: '../.env' })
console.log(process.env)

export const LOGOUT_PERIOD_MINS = process.env.REACT_APP_LOGOUT_PERIOD_MINS

What I get from the console.log() call in Base.js  is:
{NODE_ENV: "development", PUBLIC_URL: ""}

I've tried putting Base inside the root directory, which errors because it's outside src. I've tried with and without the path config setting. What am I doing wrong?

A:

As per my comment, you'll probably wanna close your terminal window and re-run yarn start from a fresh terminal. 9/10 this is the reason for env vars not showing up. :)

