使用Nginx将环境变量从docker-compose传递到vue应用 [英] Pass environment variables from docker-compose to vue app with nginx

问题描述

我想对我的vuejs应用进行docker化，并从docker-compose文件中传递环境变量。

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应用程序：

process.env.FIRST_ENV_VAR

Dockerfile：

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：

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

在构建阶段之后是否可以将环境变量传递到Web应用程序？

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

推荐答案

在vue js应用程序中，您需要将环境变量作为VUE_APP_
传递，因此在您的情况下应为VUE_APP_FIRST_ENV_VAR

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

这篇关于使用Nginx将环境变量从docker-compose传递到vue应用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！