Docker构建React项目时执行npm install后卡住是什么原因？

问题根因 #

本次构建卡住是npm内置默认行为导致的，具体原因如下：

1. npm install执行完成后会默认发起npm audit请求扫描依赖漏洞，该步骤需要访问npm官方服务，当网络环境不稳定、对npm源访问受限的时候就会无输出挂起
2. 项目依赖的core-js等包的postinstall钩子会拉取赞助提示内容，额外的网络请求也可能导致构建卡住
3. 你的Dockerfile存在逻辑问题：标记了build构建阶段但没有执行npm run build打包命令，直接使用npm start启动的是React开发服务器，不适合生产环境使用，且开发服务器启动对内存要求较高，内存不足也会导致无响应。

解决方案 #

优先修复构建卡住问题 #

将Dockerfile中的RUN npm install --production命令修改为：

RUN npm install --production --no-audit --no-fund

两个参数的作用：

• --no-audit：关闭依赖漏洞审计步骤，跳过访问npm服务器的请求
• --no-fund：关闭依赖资助提示，跳过postinstall钩子中的赞助信息拉取

如果修改后依然卡住，可以新增--ignore-scripts参数跳过所有依赖的postinstall脚本，常规业务场景下不会影响代码正常运行：

RUN npm install --production --no-audit --no-fund --ignore-scripts

生产环境镜像优化方案 #

如果需要构建生产环境使用的镜像，建议改为多阶段构建，用nginx托管静态资源，性能和稳定性远高于直接运行React开发服务器，参考Dockerfile如下：

# 第一阶段：构建React静态资源
FROM node:14.17 as build
WORKDIR /app
COPY package.json package-lock.json ./
RUN npm install --production --no-audit --no-fund
COPY . ./
RUN npm run build

# 第二阶段：用nginx托管静态资源
FROM nginx:stable-alpine
COPY --from=build /app/build /usr/share/nginx/html
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

如果确实需要保留开发服务器的使用方式，建议给Docker容器分配至少2G运行内存，避免内存不足导致进程挂起。

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