使用GitHub Actions构建React应用Docker镜像时找不到package.json的问题

根因 #

构建失败的核心原因是Docker构建上下文（context）与Dockerfile中的文件路径不匹配：

• GitHub Actions中指定的构建上下文是项目根目录（context: .）
• Dockerfile位于my-app/Dockerfile，其中COPY ./package.json /my-app指令会尝试从根目录查找package.json，但实际该文件在my-app/子目录下，因此触发文件未找到的错误。

解决方案（二选一即可） #

方案1：调整Dockerfile路径，适配根目录上下文 #

修改Dockerfile中的COPY指令，使用相对于项目根目录的路径：

# 安装依赖部分
COPY ./my-app/package.json /my-app
RUN npm install

# 复制项目文件部分
COPY ./my-app .

方案2：切换构建上下文到my-app目录，保留原Dockerfile #

修改GitHub Actions中build-and-push-image步骤的context参数，将基准目录切换为my-app：

- name: Build and push Docker image 
  uses: docker/build-push-action@ad44023a93711e3deb337508980b4b5e9bcdc5dc
  with:
    context: ./my-app  # 以my-app子目录作为构建上下文
    file: ./my-app/Dockerfile  # 保持Dockerfile路径不变（也可简化为Dockerfile，因上下文已切换）
    push: true
    tags: ${{ steps.meta.outputs.tags }}
    labels: ${{ steps.meta.outputs.labels }}

补充说明 #

Docker构建上下文是解析所有相对路径的基准目录：

• 若上下文设为根目录，所有COPY/ADD指令的源路径需相对于根目录
• 若上下文切换到子目录，指令中的路径则相对于该子目录，与你原Dockerfile的路径逻辑匹配

内容的提问来源于stack exchange，提问作者Niranjan godbole