I have tried to access to the environment variables in two ways and in both I've got the same result. The environment variable is "undefined".

First way

I have follow these steps:

1. I have installed the module "env-cmd"

2. I have created a root file called .env.development with this content:

   BACKEND_PROTOCOL = http

   BACKEND_DOMAIN = localhost

   BACKEND_PORT = 4000

3. In the script to start my application I have modified with this commands:

"env-cmd -f .env.development react-scripts start"

4. I try to get the value with:

console.log(${process.env.BACKEND_PROTOCOL}://${process.env.BACKEND_DOMAIN}:${process.env.BACKEND_PORT}); console.log(process.env.BACKEND_PROTOCOL);

5. I start the development server with:

   env-cmd -f .env.development react-scripts start

I have follow this instructions: enter link description here

Second way

1. I have installed dotenv module

2. I have created in the root a file called .env

3. I have filled this file with these values: BACKEND_PROTOCOL = http

   BACKEND_DOMAIN = localhost

   BACKEND_PORT = 4000

4. I make an import of dotenv with:

   import config from "dotenv";

5. Before to get access to the variables I call to config and the I try to get the values of the environment:

   config.config(); console.log(${process.env.BACKEND_PROTOCOL}://${process.env.BACKEND_DOMAIN}:${process.env.BACKEND_PORT}); console.log(process.env.BACKEND_PROTOCOL);

6. I start my development server with this intructions:

   react-scripts start

And I've got the same result. I've got undefined.

What am I doing wrong?