在 Dockerfile 中初始化 react.env 變量的更簡潔方法

Question

在 dockerfile 中是否有另一種方法來初始化反應環境？

FROM node:14.19 as base

ARG REACT_APP_VERSION
ARG REACT_APP_WEBSITE_NAME
ARG REACT_APP_BACKEND_BASE_URL
ARG REACT_APP_BI_BASE_URL
ARG REACT_APP_DEFAULT_DEPARTEMENT_CODE

ENV REACT_APP_VERSION $REACT_APP_VERSION
ENV REACT_APP_WEBSITE_NAME $REACT_APP_WEBSITE_NAME
ENV REACT_APP_BACKEND_BASE_URL $REACT_APP_BACKEND_BASE_URL
ENV REACT_APP_BI_BASE_URL $REACT_APP_BI_BASE_URL
ENV REACT_APP_DEFAULT_DEPARTEMENT_CODE $REACT_APP_DEFAULT_DEPARTEMENT_CODE

WORKDIR /app

COPY package.json package.json
COPY package-lock.json package-lock.json

RUN npm install
COPY . .

FROM base as development
CMD ["npm", "start"]

FROM base as build
RUN npm run build

FROM nginx:alpine as production
COPY nginx.conf /etc/nginx/conf.d/configfile.template
COPY --from=build /app/build /usr/share/nginx/html
ENV HOST 0.0.0.0
EXPOSE 8080
CMD sh -c "envsubst '\$PORT' < /etc/nginx/conf.d/configfile.template > /etc/nginx/conf.d/default.conf && nginx -g 'daemon off;'"

實際上，我在 Dockerfile 的頂部聲明了所有變量，我必須在arg中傳遞 each.env 變量。 但我不喜歡這種方式。 我正在尋找另一種方法來做到這一點。 我正在為我的管道生產部署使用雲構建，所以也許有辦法用它做些什么？

Answer 1

如果僅在構建過程中需要它們，則無需將所有 args 復制為 env。 它們將在構建期間被視為環境變量。 之后，當您運行容器時，它們就消失了。

對於第一階段，這就足夠了：

FROM node:14.19
ARG REACT_APP_VERSION="unknown" \
    REACT_APP_WEBSITE_NAME="" \
    REACT_APP_BACKEND_BASE_URL="" \
    REACT_APP_BI_BASE_URL="" \
    REACT_APP_DEFAULT_DEPARTEMENT_CODE="" \
    NODE_ENV="production"
WORKDIR /app
COPY package.json package-lock.json ./
RUN npm install
COPY . .
RUN npm run build

對於第二階段，您可以使用 nginx 模板目錄，它將為您執行envsubst並將模板復制到conf.d目錄，刪除模板后綴。

它將運行以下腳本： https://github.com/nginxinc/docker-nginx/blob/master/entrypoint/20-envsubst-on-templates.sh

因此，您可以創建帶有可變占位符的模板並將它們放在/etc/nginx/templates中。

在您的情況下，您想放置/etc/nginx/templates/default.conf.template 。

FROM nginx:alpine
ENV HOST 0.0.0.0 PORT=8080
EXPOSE 8080
COPY nginx.conf /etc/nginx/templates/default.conf.template
COPY --from=0 /app/build /usr/share/nginx/html

這樣，您還可以保留默認入口點和命令。 您不必自己設置。

我還建議使用 nginx 的非特權版本。它默認在 8080 上運行。 https://hub.docker.com/r/nginxinc/nginx-unprivileged 。 如果您計划放棄功能，建議將此映像用於生產環境，此映像通常很有用。