Heroku部署Docker版React应用时heroku.yml解析错误无具体报错

两个配置文件均存在语法/规范问题，直接导致YAML解析失败、后续构建流程无法执行：

1. Dockerfile语法缺失
   开头直接声明WORKDIR /app，缺少第一构建阶段的基础镜像声明，也未给构建阶段命名为builder，既不符合Dockerfile必须以FROM指令开头的强制要求，也会导致后续COPY --from=builder指令找不到对应构建阶段。
2. heroku.yml格式完全不符合Heroku容器部署规范，YAML缩进、字段配置均有错误：
   • build.docker层级下仅支持声明进程类型对应的镜像构建规则，不存在run这个合法子字段
   • release段配置错误：Heroku不需要单独为release阶段构建独立镜像，现有配置的image: builder为无效写法
   • run层级字段完全错位：Heroku要求run下直接以进程类型（对外提供HTTP服务必须用web作为进程名）为键，不存在嵌套的空command字段、重复image字段这类无效配置
   • 全文件缩进不统一，YAML对缩进敏感度极高，层级错位直接触发解析失败。

1. 修正front/Dockerfile #

补全第一阶段的基础镜像声明与阶段命名，修正后内容如下：

# 构建阶段：安装依赖、编译React静态产物
FROM node:18-alpine AS builder
WORKDIR /app
COPY package.json ./
COPY yarn.lock ./
RUN yarn install --frozen-lockfile
COPY . .
RUN yarn build

# 运行阶段：用Nginx托管静态文件
FROM nginx:1.19-alpine AS server
COPY ./etc/nginx.conf /etc/nginx/conf.d/default.conf
COPY --from=builder ./app/build /usr/share/nginx/html
CMD ["nginx", "-g", "daemon off;"]

注：Node版本可根据你项目实际依赖的版本调整，使用官方维护的LTS版本即可。

2. 重写根目录heroku.yml #

删除所有无效字段，统一用2空格做缩进，严格遵循Heroku配置规范，修正后内容如下：

build:
  docker:
    # web是Heroku识别公网HTTP服务的固定进程名
    web:
      dockerfile: ./front/Dockerfile
      target: server
run:
  web: nginx -g 'daemon off;'

如果你没有需要在发布前执行的数据库迁移、脚本任务等操作，不需要额外配置release段，多阶段构建过程中Docker会自动执行builder阶段的编译流程，无需单独把builder阶段构建为独立镜像。

修正配置后重新执行部署就不会再触发YAML解析错误。后续配置Nginx时注意不能硬写80端口，必须监听Heroku动态分配的$PORT环境变量指定的端口，否则服务会无法正常接收公网流量。

内容的提问来源于stack exchange，提问作者Erwan Taquet