如何在GitLab构建时在Dockerfile中使用环境变量？

结合你现有CI配置（通过build.yml生成client/.env并复制到镜像），针对Vue项目的特性，整理了三种可行方案：

方案1：构建阶段注入环境变量 #

适合需要在Docker镜像构建过程中使用变量的场景（比如控制构建行为）：

1. 在Dockerfile里用ARG定义构建参数，再转为容器环境变量：

# 声明构建时可传入的参数
ARG ENV_CLIENT
# 将参数转为容器内的环境变量，Vue项目记得加VUE_APP_前缀
ENV VUE_APP_CUSTOM_ENV=$ENV_CLIENT

COPY client .
# 如果需要在Docker内执行构建，添加这一步
RUN npm install && npm run build

2. 在CI的build.yml里，构建镜像时传递这个参数：

.build_vue_template: &build-client
  script:
    # 保留原有生成.env的步骤
    - echo "$ENV_CLIENT" > ./client/.env
    # 构建镜像时传入ARG
    - docker build --build-arg ENV_CLIENT="$ENV_CLIENT" -t your-image-tag .

build:client_develop:
  variables:
    ENV_CLIENT: "$ENV_CLIENT_DEVELOP"

方案2：运行时动态设置环境变量 #

如果需要在容器启动时动态调整环境变量（不用重新构建镜像），可以这么做：

1. 修改Dockerfile，添加启动脚本：

COPY client .
# 复制启动脚本到容器
COPY entrypoint.sh /entrypoint.sh
RUN chmod +x /entrypoint.sh
# 设置脚本为容器入口
ENTRYPOINT ["/entrypoint.sh"]

2. 编写entrypoint.sh脚本：

#!/bin/sh
# 如果启动容器时传入了ENV_CLIENT，覆盖.env文件
if [ -n "$ENV_CLIENT" ]; then
  echo "$ENV_CLIENT" > ./client/.env
fi
# 启动你的应用，比如静态Vue项目用nginx
nginx -g "daemon off;"

3. 启动容器时传入变量：

docker run -e ENV_CLIENT="VUE_APP_API_URL=https://new-api.example.com" your-image-tag

方案3：复用现有生成的.env文件 #

你当前已经在CI中生成了client/.env并通过COPY client .复制到镜像里，只要满足以下两点，Vue应用就能自动读取这些变量：

• .env里的变量必须以VUE_APP_开头（Vue CLI会自动注入这类变量到应用代码中）
• 确保.env格式正确，比如：

VUE_APP_API_BASE=https://dev.example.com/api
VUE_APP_SHOW_DEBUG=true

容器启动后，应用会自动加载这个文件的环境变量，不需要额外修改Dockerfile。

内容的提问来源于stack exchange，提问作者Dương Hoàng Văn