title: Pass environment variable value to Angular app from docker file
body: <p>I have an Angular app where i'm trying to set the environment variable from outside of the app i.e., from docker compose file.</p>
  <p>I'm referring below article</p>
  <p><a href="https://codinglatte.com/posts/angular/using-os-environment-variables-in-angular-with-docker/" rel="nofollow noreferrer">https://codinglatte.com/posts/angular/using-os-environment-variables-in-angular-with-docker/</a></p>
  <p><strong>docker-compose.yml</strong></p>
  <pre><code>version: '3'
  services:
    tomcat-server:
      image: &quot;tomcat:latest&quot;
      ports:
        - &quot;8071:8080&quot;
      environment:
        - API_URL=http://demo-production.com
  </code></pre>
  <p>I could even see the environment variable set when I execute the below command</p>
  <pre><code>docker exec -it &lt;dockerName&gt; sh
  
  env
  </code></pre>
  <p>but somehow the value is not being received by Angular app, below is my Angular app code as per the above article</p>
  <p><strong>environment.prod.ts</strong></p>
  <pre><code>export const environment = {
    production: true,
    API_URL: $ENV.API_URL,
    TEST_ENV: 'testing'
    // API_URL: 'http://production.com'
  };
  </code></pre>
  <p><strong>typings.d.ts</strong></p>
  <pre><code>declare var $ENV: Env;
  
  interface Env {
      API_URL: string
  }
  </code></pre>
  <p><strong>custom-webpack.config.js</strong></p>
  <pre><code>const webpack =  require('webpack');
  module.exports = {
          plugins: [
              new webpack.DefinePlugin({
                  $ENV: {
                      API_URL: JSON.stringify(process.env.API_URL)
                  }
              })
          ]
  };
  </code></pre>
  <p>Command I used to create the build</p>
  <pre><code>ng build --configuration=production --base-href=/demoapp/
  </code></pre>
  <p>I couldn't figure out the issue here as the environment value set in docker file is not reflecting in my app.</p>
  <p>Can I get some help here?</p>