使用Dokku中的Dockerized Vue应用程序获取env变量



我已经使用Docker(和Docker Compose(创建了一个Vue项目,并且正在使用Dokku进行部署。我已经配置了足够的项目,它可以在生产中成功部署。但是,在尝试访问Vue CLI构建脚本中的环境变量时遇到了麻烦。由于Vue CLI的工作方式,环境变量基本上是在构建时(而不是运行时(构建到应用程序中的。这意味着我在编译应用程序时需要环境变量,我通过生产Dockerfile来管理这些变量。

Auth0-Dokku指南是非常宝贵的,但在构建时(我被卡住的地方(没有处理将环境变量从Dokku传递到Vue CLI的问题。有了Docker Compose(开发(,这很容易,但Dockerfile(生产(似乎有所不同(为所需的每个变量使用ARGENV(。

# === Base stage =====
FROM node:12.2-alpine AS base
WORKDIR /app
# node_modules are managed inside the container
COPY package*.json ./
# === Dependency stage =====
FROM base AS dependencies
# Install ONLY production dependencies
RUN npm install --only=production
# Copy production dependencies aside
RUN cp -R node_modules prod_node_modules
# Install ALL dependencies
RUN npm install
# === Build stage =====
FROM dependencies AS build
# Copy the rest of the application
COPY . .
# NOTE: It appears to be necessary to use BOTH 'ARG' and 'ENV'?
ARG VUE_APP_API_URL
ENV VUE_APP_API_URL ${VUE_APP_API_URL}
# ...repeat for EVERY build variable necessary?
# Build the Vue application, outputting the static files to /dist
RUN npm run build
# === Release stage =====
FROM base AS release
# Copy production dependencies (overwriting all dependencies, used for building)
COPY --from=dependencies /app/prod_node_modules ./node_modules
# Copy the build artifacts from the build stage
COPY --from=build /app/dist ./dist
# Copy the simple server file
COPY server.js /app/server.js
EXPOSE 8080
CMD node server.js

关键部分是ARGENV的使用。。。没有比对Vue构建过程中使用的每个变量(即.app配置文件(重复这一点更好的方法了吗?

# NOTE: It appears to be necessary to use BOTH 'ARG' and 'ENV'?
ARG VUE_APP_API_URL
ENV VUE_APP_API_URL ${VUE_APP_API_URL}
# ...repeat for EVERY build variable necessary?

该应用程序已成功构建并正确部署在小型Express服务器容器中。使用上述Dockerfile设置时,环境变量将在Vue CLI构建时填充。我在Vue项目中使用config.js文件来在构建时获取环境变量。请注意VUE_APP_变量前缀的正确使用(Vue CLI需要(。

export default {
api: {
url: process.env.VUE_APP_API_URL,
},
app: {
envName: process.env.VUE_APP_ENV_NAME || "local",
isProduction: process.env.NODE_ENV === "production",
},
};

我尝试添加必要的环境变量,既作为Dokkuconfig变量,也作为docker-options变量。我对Dokku文档中关于构建时配置变量的内容有点困惑。这是指仅在Dockerfile中使用的变量,还是指本质上作为process.env提供的变量?

# Set Dokku environment variables (NOT USED)
dokku config:set [app_name] VUE_APP_API_URL=https://api.example.org
# Set Docker build variable (USED WITH ARG/ENV)
dokku docker-options:add [app_name] build "--build-arg VUE_APP_API_URL=https://api.example.org"

必须有更好的方法来传递环境变量,而不是在Dockerfile中占用这么多行(和阶段(!

TL;DR:使用Dockerfile进行构建时,是否有更好的方法将环境变量从Dokku传递到Vue CLI构建脚本?必须用这么多ARGENV声明更新生产Dockerfile,然后仍然必须用冗长的语法在dokku docker-options中单独设置每一个声明,这似乎很疯狂!

TL;DR2:为什么它不适用于dokku config,因为我没有使用构建时间变量,但Vue CLI使用当前环境变量来构建应用程序?为什么Vue CLI在构建时使用dokku config变量?

没有更好的方法在构建时(docker构建(传递这些变量。这是有目的的,因为docker图像不应该有秘密。

如果有什么不同的话,最好将该配置移到一个在应用程序启动时生成的文件中,此时它将是运行时配置(docker-run(。

这是基于Dockerfile最佳实践的,如下所示。

将所有配置变量设置为构建参数可能是一个很好的功能请求。

最新更新