React JS app: .env var returns undefined

I’m having trouble getting environment variables to work in my React app. I have done the following:

  1. Installed the latest version of react-scripts
  2. Added a .env file in the root folder (same location as node_modules)
  3. Added REACT_APP_OTHER_OTHER_THING=asdfas to test the variable
  1. Opened index.js and added console.log(process.env.REACT_APP_OTHER_OTHER_THING) inside to see the output
import React from 'react';
import Reactdom from 'react-dom';
import App from './App';

console.log(process.env.REACT_APP_OTHER_OTHER_THING, 'DOTENV')

Reactdom.render(<App/>, document.getElementById("app"))

After rebuilding the app and starting it, the output for process.env.REACT_APP_OTHER_OTHER_THING is undefined. I have also tried adding a temporary variable as the Create React App documentation suggests, and running ($env:REACT_APP_OTHER_OTHER_THING= "abcdef") -and (npm start) (in Powershell), but the output is still undefined.

What can I do to get the environment variables to work?

Make sure that your .env file is named correctly and is in the root directory of your project. The variable name in the .env file should be prefixed with REACT_APP_. Also, make sure to restart your development server after making changes to the .env file.