1

With angular6, the global variable process is undefined.

I dockerlize my angular app using docker-compose.yml and Dockerfile

I create .env file store my secret variables used by docker-compose.yml

But, if I get the variables stored in .env file in application code like this:

process.env.GITHUB_ACCESS_TOKEN

An error will be thrown

ERROR in src/app/app.module.ts(41,58): error TS2304: Cannot find name 'process'.
src/app/app.module.ts(53,12): error TS2304: Cannot find name 'process'.

My requirements are:

  1. run application in docker container using docker-compose up
  2. Within application code, get the environment variables which are defined in .env file.

Here is my docker-compose.yml: 

version: '2.1'

services:
  angular-apollo-starter:
    image: angular-apollo-starter
    build: .
    environment:
      NODE_ENV: production
    env_file: .env
    ports:
      - 8080:80

I think pass environment variables workflow should be like this:

.env -> environment.prod.ts -> application code

update

I found an issue about this problem: https://github.com/angular/angular-cli/issues/4318

Lin Du
  • 88,126
  • 95
  • 281
  • 483
  • have you tried like `./.env` ? – chintan thakar Jul 16 '18 at 06:17
  • And your build process is before deploying on docker right? – David Jul 16 '18 at 06:44
  • You could try retrieving settings at runtime from a json file located in the assets folder (instead of directly using environment.ts). That json config file would contain placeholders that'd be replaced with en variables when you start your CMD process – David Jul 16 '18 at 06:51

1 Answers1

1

You can create a script and execute it before build with something like prebuild. In that script you have access to process and you can replace some values in environment.ts with what you need.

Adrian Fâciu
  • 12,414
  • 3
  • 53
  • 68