CODEWITHSUNDEEP
dockervue.jsnginxdocker-compose
nati nati
nati nati

Reputation: 73

Pass environment variables from docker-compose to vue app with nginx

I want to dockerize my vuejs app and to pass it environment variables from the docker-compose file.

I suspect the app gets the environment variables only at the build stage, so it does not get the environment variables from the docker-compose.

vue app:

process.env.FIRST_ENV_VAR

Dockerfile:

FROM alpine:3.7

RUN apk add --update nginx nodejs

RUN mkdir -p /tmp/nginx/vue-single-page-app
RUN mkdir -p /var/log/nginx
RUN mkdir -p /var/www/html

COPY nginx_config/nginx.conf /etc/nginx/nginx.conf
COPY nginx_config/default.conf /etc/nginx/conf.d/default.conf

WORKDIR /tmp/nginx/vue-single-page-app

COPY . .

RUN npm install

RUN npm run build

RUN cp -r dist/* /var/www/html

RUN chown nginx:nginx /var/www/html

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

docker-compose:

version: '3.6'

services:

  app:
    image: myRegistry/myProject:tag
    restart: always
    environment:
      - FIRST_ENV_VAR="first environment variable"
      - SECOND_ENV_VAR="first environment variable"
    ports:
      - 8080:8080

Is there any way to pass environment variables to a web application after the build stage?

Upvotes: 5

Views: 8640

Answers (4)

Juan
Juan

Reputation: 574

Based on this https://medium.com/@rakhayyat/vuejs-on-docker-environment-specific-settings-daf2de660b9, I have made a silly npm package that help to acomplish what you want.

Go to https://github.com/juanise/jvjr-docker-env and take a look to README file.

Basically just run npm install jvjr-docker-env. A new Dockerfile, entrypoint and json file will be added to your project.

Probably you will need to modify some directory and/or file name in Dockerfile in order to work.

Upvotes: 1

Harloveleen Kaur
Harloveleen Kaur

Reputation: 82

In vue js apps you need to pass the env variables as VUE_APP_ so in your case it should be VUE_APP_FIRST_ENV_VAR

Upvotes: 2

Facundo Diaz Cobos
Facundo Diaz Cobos

Reputation: 367

As you can see in the docker docs docker-compose reference envs the defined environment values are always available in the container, not only at build stage.

You can check this by change the CMD to execute the command "env" to display all environments in your container.

If your application is not getting the actual values of the env variables it should be anything else related with your app

Upvotes: -3

7_R3X
7_R3X

Reputation: 4370

You can try this. The value of FIRST_ENV_VAR inside docker will be set to the value of FIRST_ENV_VAR_ON_HOST on your host system.

version: '3.6'

services:

  app:
    image: myRegistry/myProject:tag
    restart: always
    environment:
      - FIRST_ENV_VAR=$FIRST_ENV_VAR_ON_HOST
      - SECOND_ENV_VAR=$SECOND_ENV_VAR_ON_HOST
    ports:
      - 8080:8080

Upvotes: 0

Related Questions