为何package.json未复制到Docker多阶段构建的最终阶段？

你的问题核心在于多阶段构建的final阶段仅复制了React构建后的静态文件，但启动脚本却尝试执行依赖package.json的npm命令。

问题分析 #

在你的Dockerfile里，frontend阶段完成了React应用的依赖安装与构建，但final阶段只复制了/app/frontend/build目录（即静态构建产物），并没有把前端的package.json和node_modules复制过来。而你的start.sh大概率包含了类似cd frontend && npm start的指令，这就导致运行时npm找不到package.json抛出错误。

实际上生产环境下，React应用的构建产物是纯静态资源，完全不需要package.json和依赖包，直接用静态文件服务器托管即可，没必要再通过npm启动。

修正方案 #

1. 调整Dockerfile优化复制逻辑

简化各阶段工作目录，确保仅复制必要文件到final阶段：

FROM node:16-alpine AS frontend
# 直接将工作目录设为frontend，避免多层路径冗余
WORKDIR /app/frontend
COPY ./frontend/package.json ./
RUN npm install
COPY ./frontend ./
RUN npm run build

FROM node:16-alpine AS backend
WORKDIR /app/backend
COPY ./backend/package.json ./
RUN npm install
COPY ./backend ./

FROM node:16-alpine AS final
WORKDIR /app

ARG DOCKER_ENV
ENV NODE_ENV=${DOCKER_ENV}

RUN npm install -g serve

# 仅复制前端构建产物和后端完整代码
COPY --from=frontend /app/frontend/build ./frontend-build
COPY --from=backend /app/backend ./backend

COPY start.sh /app/
RUN chmod +x /app/start.sh

CMD ["/app/start.sh"]

2. 修改start.sh启动逻辑

用serve直接托管前端静态文件，同时启动后端服务：

#!/bin/sh
# 后台启动后端
cd /app/backend && npm start &
# 启动静态文件服务器托管前端构建产物，端口可按需调整
serve -s /app/frontend-build -l 3000

替代方案：后端托管前端静态文件

如果你的Node.js后端（如Express）本身要负责托管前端静态文件，可直接将前端build目录复制到后端的静态文件目录下：

• 修改Dockerfile的final阶段：

COPY --from=frontend /app/frontend/build ./backend/public

• 在后端代码中添加静态文件服务（以Express为例）：

const express = require('express');
const app = express();

// 托管前端静态文件
app.use(express.static('public'));

// 其他后端路由逻辑...
app.listen(3000);

• 此时start.sh只需启动后端：

#!/bin/sh
cd /app/backend && npm start

关键总结 #

生产环境下React应用无需保留package.json和依赖包，仅需构建后的静态文件即可。多阶段构建的核心就是只将必要产物复制到最终镜像，既减少镜像体积，又能避免不必要的文件依赖问题。

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