Put parameters in docker container of Angular app

Question

I have an angular application and it was required to me to put it in a docker image. My first version of the Dockerfile is as next:

### STAGE 1: Build ###

# We label our stage as 'builder'
FROM node:8-alpine as builder

COPY package.json package-lock.json ./

RUN npm set progress=false && npm config set depth 0 && npm cache clean --force

## Storing node modules on a separate layer will prevent unnecessary npm installs at each build
RUN npm i && mkdir /ng-app && cp -R ./node_modules ./ng-app

WORKDIR /ng-app

COPY . .

## Build the angular app in production mode and store the artifacts in dist folder
RUN $(npm bin)/ng build --prod --build-optimizer


### STAGE 2: Setup ###

FROM nginx:1.13.3-alpine

## Copy our default nginx config
COPY nginx/default.conf /etc/nginx/conf.d/

## Remove default nginx website
RUN rm -rf /usr/share/nginx/html/*

## From 'builder' stage copy over the artifacts in dist folder to default nginx public folder
COPY --from=builder /ng-app/dist /usr/share/nginx/html

CMD ["nginx", "-g", "daemon off;"]

Now, as the project have the environment files I need to find a way that I can pass those parameters like "enviroment" variables of the docker containers, example docker run -e VARIABLE=VALUE myImage

So, I infer that I will need to set those values inside the environment file before make the compilation, but I don't know how to achieve it. I would like to get some help on this matter, and thank you very much in advance

Cyclonecode · Answer 1 · 2018-04-13T15:57:14.543

I would use docker-compose. You can define your environment variables inside a docker-compose.yml file. If using the env_file configuration option, you could also declare multiple variables in a separate file.

From the documentation:

Set environment variables in containers

You can set environment variables in a service’s containers with the ‘environment’ key, just like with docker run -e VARIABLE=VALUE ...:

web:
  environment:
    - DEBUG=1

Pass environment variables to containers

You can pass environment variables from your shell straight through to a service’s containers with the ‘environment’ key by not giving them a value, just like with docker run -e VARIABLE ...:

web:
  environment:
    - DEBUG

Here is a small example setting a environment variable DEBUG to development inside a container:

Dockerfile:

FROM ubuntu

version: "3"
  services:
    example:
      build:
        context: .
        dockerfile: Dockerfile
      environment:
        - DEBUG="development"

Setup:

# build 
./docker-compose build
# start
./docker-compose up
# display all declared variables in container
./docker-compose exec example env

Since you would like to use an image from dockerhub you could simply pull the image using docker-compose:

# docker-compose.yml
version: "3"
services:
  example:
    image: ubuntu
  environment:
    - DEBUG="development"
  entrypoint:
    - <YOURENTRYPOINT>

Pull the specified service image:

./docker-compose pull example

Run the container:

./docker-compose up example

Reference

Environment variables in Compose

nice approach! however my clients needs and want the images build in docker-hub, so, I must generrate the images and catch te values from the docker run command — Sredny M Casanova, Apr 13 '18 at 15:22
@SrednyMCasanova - But shouldn't you be able to use a `docker-compose.yml` file and pull the desired Dockerfile from dockerhub? — Cyclonecode, Apr 13 '18 at 15:32
@SrednyMCasanova - You should be able to specify an image to use in your docker-compose.yml file. I updated my answer. Not really sure I understand what you're trying to do here =) — Cyclonecode, Apr 13 '18 at 15:58
Maybe this link will help you: https://stackoverflow.com/questions/48595829/how-to-pass-environment-variables-to-a-frontend-web-application/49349963#49349963 — Daniel Caldera, Apr 26 '18 at 20:05

Put parameters in docker container of Angular app

1 Answers1