Question

我有一个用webpack构建的react应用程序，我想在docker容器中部署它。我目前正在使用DefinePlugin在构建阶段将应用程序的api URL以及一些其他环境变量传递到应用程序中。我的webpack配置的相关部分如下所示：

plugins: [
    new DefinePlugin({
        GRAPHQL_API_URL: JSON.stringify(process.env.GRAPHQL_API_URL),
        DEBUG: process.env.DEBUG,
        ...
    }),
    ...
]

由于此策略在构建时需要环境变量，所以我的docker文件有点棘手，因为我实际上需要将Webpack构建调用作为CMD命令的一部分：

FROM node:10.16.0-alpine

WORKDIR /usr/app/

COPY . ./

RUN npm install

# EXPOSE and serve -l ports should match
EXPOSE 3000
CMD npm run build && npm run serve -- -l 3000

我希望webpack中的构建步骤成为docker容器中的一个层（一个RUN命令），因此我可以在构建成功后清除所有源文件，因此启动速度更快。当您仅提供静态文件时，是否存在使用docker环境中的信息来处理此问题的标准策略？

Answer 1

如何在docker内部的静态站点中使用环境变量？

这个问题比我想的具体问题还要广泛。对此的通用答案是，就本质而言，您不能这样做，因为内容是静态的。如果您需要API URL在运行时是动态且可修改的，那么就需要某些功能来支持它。我对webpack不太熟悉，无法知道它是否可以工作，但是以下链接上有很多信息可能会对您有所帮助。

Passing environment-dependent variables in webpack

在仅提供静态文件的情况下，是否存在一种标准策略来处理使用docker环境中的信息的问题？

如果您愿意将API URL烘焙到图像中，则通常具有静态内容的标准策略是使用多阶段构建。这样会生成静态内容，然后将其复制到新的基础映像中，从而保留了构建所需的所有依赖项。

https://docs.docker.com/develop/develop-images/multistage-build/

如何在docker内部的静态站点中使用环境变量？

1 个答案: