Create React App Build 和 Docker-Compose 不传递环境变量答案

【问题标题】：Create React App Build and Docker-Compose do not pass env variablesCreate React App Build 和 Docker-Compose 不传递环境变量
【发布时间】：2018-12-11 10:04:59
【问题描述】：

我目前正在尝试对 CRA 应用程序进行多步构建。我的 dockerfile 如下所示

FROM node:10-alpine

WORKDIR /usr/app

COPY package*.json ./

RUN npm install

COPY . .

RUN npm run build

FROM nginx:1.15

COPY --from=0 /usr/app/nginx/default.conf /etc/nginx/conf.d/default.conf
COPY --from=0 /usr/app/build /usr/share/nginx/html

EXPOSE 6000

我的 react 部分的 docker compose 文件如下所示

  web_front:
    build:
      context: Web Front-CRA
    ports:
      - "${WEB_FRONT_PORT}:6000"
    env_file:
      - .env
    volumes:
      - /usr/app/node_modules
      - ./Web Front-CRA:/usr/app

当我尝试使用docker-compose up --build 运行它时，我无法读取NODE_PATH=./src/ 环境文件（所有环境变量实际上都在RUN npm run build 阶段。

但是，如果我只是像下面这样更改 dockerfile 来运行开发环境，它可以完美运行 - 所有 env 文件都已通过

FROM node:10-alpine

# work directory
WORKDIR /usr/app

# Copy dependencies first for effective caching
COPY package*.json ./

RUN npm install

COPY . .

EXPOSE 6000

CMD ["npm", "run", "start"]

我目前正在使用 ubuntu 18 和 docker-compose v1.23.2 和 Docker 18.09.0。我做错了什么？

【问题讨论】：

标签： reactjs docker docker-compose create-react-app

【解决方案1】：

对于要从 docker compose 构建阶段传递到 dockerfile 的环境变量，您必须在 docker-compose 构建步骤中使用 args:。下面的例子

web_front:
    build:
      context: Web Front-CRA
      args:
         NODE_PATH=./src/
    ports:
      - "${WEB_FRONT_PORT}:6000"
    env_file:
      - .env
    volumes:
      - /usr/app/node_modules
      - ./Web Front-CRA:/usr/app

对应的dockerfile

FROM node:10-alpine
ARG NODE_PATH
WORKDIR /usr/app

COPY package*.json ./

RUN npm install

COPY . .

RUN npm run build

FROM nginx:1.15

COPY --from=0 /usr/app/nginx/default.conf /etc/nginx/conf.d/default.conf
COPY --from=0 /usr/app/build /usr/share/nginx/html

EXPOSE 6000

使用$NODE_PATH 在 dockerfile 中访问它。 PS我在这里使用环境变量而不是envfile。但我希望你明白这一点。干杯。

【讨论】：

【解决方案2】：

.env 文件是一个特殊的名称保留文件，用于 docker-compose 设置环境变量的默认值，所以如果你想使用它，你不应该在你的 compose 文件中指定，或者使用不同的文件名（例如：myservice.env）为您的env_file 部分。

  web_front:
    env_file:
      - webfront.env
...

docker 文档在 Compose file and CLI variables / Notes 部分的 https://docs.docker.com/compose/env-file/ 下模糊地提到了这一点

.env 文件中定义的环境变量在容器内不会自动可见。

要设置容器适用的环境变量，请遵循 Compose 中的环境变量主题中的指南，该主题描述了如何将 shell 环境变量传递给容器、在 Compose 文件中定义环境变量等等：

https://docs.docker.com/compose/environment-variables/#the-env_file-configuration-option

【讨论】：