title: Environment variables - undefined
body: <p>I want to use <code>environment variables</code>. I made a custom <code>react app environment</code>.</p>
  
  <p>Everything is ok, the app runs properly, no errors. But the variables from <code>.env</code> file gives <code>undefined</code> and the <code>process.env</code> gives an <code>empty object</code>.</p>
  
  <p>I added <a href="https://www.npmjs.com/package/dotenv" rel="nofollow noreferrer">dotenv</a> and <code>REACT_APP</code> prefix to the variable.</p>
  
  <p>And in <code>webpack.config.js</code> file i added <code>node: { fs: 'empty' }</code>, from <a href="https://github.com/webpack-contrib/css-loader/issues/447#issuecomment-285598881" rel="nofollow noreferrer">here</a></p>
  
  <p>Here are my <a href="https://gist.github.com/grecdev/1bea111149f2a5cc697d1d6dd7194d9c?ts=2" rel="nofollow noreferrer">configurations</a>.</p>
  
  <p>Folder structure:</p>
  
  <p><a href="https://i.stack.imgur.com/wZzHf.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/wZzHf.png" alt="enter image description here"></a></p>