使用 nginx 将环境变量从 docker-compose 传递到 vue 应用程序

Question

我想对我的 vuejs 应用程序进行 dockerize 并从 docker-compose 文件传递​​环境变量。

我怀疑应用程序仅在构建阶段获取环境变量，因此它不会从 docker-compose 获取环境变量。

vue应用程序：

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-撰写：

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

有没有办法在构建阶段后将环境变量传递给 Web 应用程序？

Answer 1

你可以试试这个。内部 docker的值FIRST_ENV_VAR将设置FIRST_ENV_VAR_ON_HOST为主机系统上的值。

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