部署Angular Docker应用到Heroku时Dockerfile最后COPY步骤找不到/app/build报错问询

• 核心原因：Angular 框架执行 npm run build 后的默认产物输出目录为 dist/[项目名称]，你配置的 /app/build/ 是 React 等其他框架的默认输出目录，路径不匹配导致构建时找不到对应文件。
• 次要问题：Dockerfile 中指令顺序不符合规范，CMD 是容器启动时执行的命令，需要放在所有构建类指令（COPY、RUN 等）的末尾，你当前把 COPY 放在 CMD 之后，虽然不会直接引发本次报错，但会导致后续维护风险。
• 其他可能：如果你手动修改过 angular.json 中的 outputPath 配置，配置值和 Dockerfile 中写的路径不一致也会触发该报错。

方案1：直接修正 Dockerfile 中的产物路径 #

1. 先在本地项目根目录执行 npm run build，查看生成的产物目录具体名称（默认格式为 dist/你的项目名，比如项目名是 angular-demo 则路径为 dist/angular-demo）
2. 修改 Dockerfile 最后一行的 COPY 指令，替换为实际的产物路径：

# 替换<your-project-name>为你实际的项目名称
COPY --from=builder /app/dist/<your-project-name>/ /usr/share/nginx/html

3. 调整 Dockerfile 中 CMD 指令的位置，放到所有构建指令的最后，修正后的 Dockerfile 末尾部分如下：

COPY --from=builder /app/nginx.conf /etc/nginx/nginx.template
COPY --from=builder /app/dist/<your-project-name>/ /usr/share/nginx/html
CMD ["/bin/sh", "-c", "envsubst < /etc/nginx/nginx.template > /etc/nginx/conf.d/default.conf && nginx -g 'daemon off;'"]

方案2：统一产物输出目录为 build #

如果你不想修改 Dockerfile 的路径配置，可以修改 Angular 项目的输出配置：

1. 打开项目根目录的 angular.json 文件，找到 projects -> 你的项目名 -> architect -> build -> options 配置项
2. 将其中的 outputPath 值修改为 build
3. 重新执行镜像构建即可正常运行

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