在WSL中构建React TypeScript项目Docker镜像时遇next权限拒绝错误

1. 添加.dockerignore排除本地node_modules #

你的Dockerfile先执行npm install安装容器内依赖，之后用COPY . .复制本地文件，如果本地存在node_modules目录，会直接覆盖容器内的依赖包。WSL环境下本地node_modules的文件权限与Alpine容器内的权限不兼容，会导致next命令无执行权限。

创建.dockerignore文件，添加以下内容：

node_modules
.next
npm-debug.log

2. 修改build脚本用npx调用next #

本地安装的next可能未加入系统PATH，或权限不足，用npx可直接调用本地node_modules中的next命令，规避路径和权限问题：
修改package.json的build脚本：

"scripts": {
  "build": "npx next build"
}

3. 在容器内安装依赖时指定unsafe-perm #

你在WSL终端设置的unsafe-perm仅对本地npm生效，容器内需要单独配置。修改Dockerfile中的npm install命令：

RUN npm install --unsafe-perm=true --allow-root

4. 手动赋予next执行权限（兜底方案） #

若以上方法无效，可在npm install后手动为next二进制文件添加执行权限：

RUN npm install
RUN chmod +x node_modules/.bin/next

完成以上修改后，重新执行docker build .即可正常构建镜像。

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