使用Dockerfile构建Angular项目时出现ng: not found错误求助

昨天突然遇到Docker构建Angular镜像失败的问题，此前一切正常，未修改任何项目文件，5小时前还能正常构建。核心问题是npm install阶段出现异常，后续执行npm run build时提示ng: not found。

Dockerfile 内容 #

# Stage 1: Build the Angular application
FROM node:latest AS build
WORKDIR /app
COPY package.json package-lock.json ./
RUN npm install
COPY . .
RUN npm run build --prod

# Stage 2: Serve the application with Nginx
FROM nginx:latest
COPY --from=build /app/dist/gate /usr/share/nginx/html
COPY nginx.conf /etc/nginx/nginx.conf
# Copy self-signed SSL certificates
COPY certs /etc/nginx/certs
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

构建错误日志 #

4/6
RUN npm install
14.0s
npm warn deprecated w3c-hr-time@1.0.2: Use your platform's native performance.now() and performance.timeOrigin.
npm warn deprecated rimraf@3.0.2: Rimraf versions prior to v4 are no longer supported
npm warn deprecated read-package-json@6.0.4: This package is no longer supported. Please use @npmcli/package-json instead.
npm error Exit handler never called!
npm error This is an error with npm itself. Please report this error at:
npm error <https://github.com/npm/cli/issues>
npm error A complete log of this run can be found in: /root/.npm/_logs/2024-07-18T20_54_10_021Z-debug-0.log
build
5/6
COPY . .
1.0s
build
6/6
RUN npm run build --omit=dev
ERROR
0.0s
> frontend@0.0.0 build
> ng build
sh: 1: ng: not found

之前成功的构建日志（对比用） #

build
4/6
RUN npm install
16.0s
npm warn deprecated w3c-hr-time@1.0.2: Use your platform's native performance.now() and performance.timeOrigin.
npm warn deprecated domexception@2.0.1: Use your platform's native DOMException instead
npm warn deprecated abab@2.0.6: Use your platform's native atob() and btoa() methods instead
npm warn deprecated @npmcli/move-file@2.0.1: This functionality has been moved to @npmcli/fs
npm warn deprecated @wessberg/ts-evaluator@0.0.27: this package has been renamed to ts-evaluator. Please install ts-evaluator instead
npm warn deprecated @babel/plugin-proposal-unicode-property-regex@7.18.6: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-unicode-property-regex instead.
npm warn deprecated @babel/plugin-proposal-async-generator-functions@7.20.7: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-async-generator-functions instead.
added 1089 packages, and audited 1090 packages in 15s
120 packages are looking for funding
run `npm fund` for details
10 vulnerabilities (4 moderate, 6 high)
To address all issues, run:
npm audit fix
Run `npm audit` for details.
npm notice
npm notice New patch version of npm available! 10.8.1 -> 10.8.2
npm notice Changelog: https://github.com/npm/cli/releases/tag/v10.8.2
npm notice To update run: npm install -g npm@10.8.2
npm notice
build
5/6
COPY . .
8.0s
build
6/6
RUN npm run build --prod
32.0s
npm warn config production Use `--omit=dev` instead.
> frontend@0.0.0 build
> ng build
- Generating browser application bundles (phase: setup)...
√ Browser application bundle generation complete.
√ Browser application bundle generation complete.
- Copying assets...
√ Copying assets complete.
- Generating index html...
- Generating index html...
2 rules skipped due to selector errors:
.form-floating>~label -> Did not expect successive traversals.
.form-floating>~label -> Did not expect successive traversals.
√ Index html generation complete.
Initial Chunk Files | Names | Raw Size | Estimated Transfer Size
main.486f9d20944b6cd4.js | main | 1.65 MB | 351.20 kB
styles.b35c1c689cedab16.css | styles | 329.66 kB | 32.46 kB
scripts.1ac6d0d02f230370.js | scripts | 77.70 kB | 20.87 kB
polyfills.4cb30b968c6ea108.js | polyfills | 33.03 kB | 10.66 kB
runtime.f0cd325c9a9e41bb.js | runtime | 988 bytes | 556 bytes
| Initial Total | 2.08 MB | 415.74 kB
Build at: 2024-07-18T13:14:22.046Z - Hash: 52b720b54f35c1fe - Time: 30454ms
Warning: /app/src/app/checklist/checklist-view/checklist-view.component.ts depends on 'moment'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies

已尝试的无效方案 #

• 清理npm缓存
• 删除本地node_modules文件夹
• 删除package-lock.json后重新执行npm install
• 将npm版本降级至8.x、6.x

本地环境版本 #

Angular CLI: 16.2.12
Node: 20.15.1 (Unsupported)
Package Manager: npm 10.8.2
OS: win32 x64

Angular: 16.2.12
... animations, cli, common, compiler, compiler-cli, core, forms
... localize, platform-browser, platform-browser-dynamic, router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1602.12
@angular-devkit/build-angular   16.2.12
@angular-devkit/core            16.2.12
@angular-devkit/schematics      16.2.12
@angular/cdk                    16.2.14
@angular/material               16.2.14
@schematics/angular             16.2.12
rxjs                            7.8.1
typescript                      5.1.6
zone.js                         0.13.3

Warning: The current version of Node (20.15.1) is not supported by Angular.

可能的解决方向 #

1. 固定Node版本而非使用latest：Angular 16.2.x官方推荐Node 16.x或18.x，修改Dockerfile第一行为FROM node:18-alpine AS build，避免latest标签自动升级带来的版本兼容问题。
2. 确保Angular CLI安装完整：在RUN npm install后添加RUN npm install -g @angular/cli@16.2.12，或检查package.json是否将@angular/cli列为开发依赖，确保构建环境中cli可被调用。
3. 添加npm安装参数解决依赖冲突：将RUN npm install改为RUN npm install --legacy-peer-deps，绕过可能的依赖版本冲突问题。
4. 清理Docker构建缓存：执行docker builder prune清理本地构建缓存，避免缓存的损坏依赖包干扰新构建。
5. 切换本地Node版本到官方支持范围：本地使用的Node 20.x不被Angular 16支持，切换到Node 18.x后先尝试本地构建，确认项目本身无问题后再进行Docker构建。

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