首页 > 解决方案 > 无法为 Angular 9 应用程序构建 Docker 映像

问题描述

我有一个相当复杂的 Angular 9 应用程序,它使用第三方解决方案,如传单、threejs 和 PrimeNG 组件。我无法使用我的 Dockerfile 构建 Docker 映像。

我可以构建人们发布的大多数关于 Docker<->Angular 的简单应用程序。但这些应用程序只做“Hello World”或显示 Angular 徽标。

请注意,我可以在 Visual Studio Code 中很好地构建项目。我在底部展示了 Angular 9 项目的图片。使用其中一个简单视频中的 Dockerfile,出于命名原因,我做了一些修改。我使用 node:12.2.0 因为这是我在 VSC 中使用的。

# stage 1 get any base dockerhub images
FROM node:12.2.0 AS builder

# here I build a base working directory "inside the image!" as /app
WORKDIR /app

# this copy will copy all files from the Frontend_Serenity_A9 folder to the /app directory in the image.
COPY . .

RUN npm install
RUN npm run build --prod

#STAGE 2
FROM nginx:1.15.8-alpine
COPY --from=builder /app/dist/Frontend_Serenity_A9 /usr/share/nginx/html

当它尝试构建 Docker 映像时,大约需要 6 分钟,然后失败。我在下面展示了构建过程的重要部分,然后是失败。请注意,它还说要查看日志文件以获取更多详细信息,但我无法在我的机器上的任何地方找到这些日志文件。

已经为此工作了一周并尝试了一切。非常感谢您的任何帮助或想法。谢谢!!

> Executing task: docker build --pull --rm -f "Dockerfile" -t frontendserenitya9:test1 "." <

[+] Building 345.3s (10/12)
 => [internal] load build definition from Dockerfile                                                                                                                                                          0.0s 
 => => transferring dockerfile: 465B                                                                                                                                                                              0.0s 
 => [internal] load .dockerignore                                                                                                                                                                                 0.1s 
 => => transferring context: 52B                                                                                                                                                                                  0.0s 
 => [internal] load metadata for docker.io/library/nginx:1.15.8-alpine                                                                                                                                            1.3s 
 => [internal] load metadata for docker.io/library/node:12.2.0                                                                                                                                                    1.0s 
 => [builder 1/5] FROM docker.io/library/node:12.2.0@sha256:3d4411d1933dc93e78b9e0de556a22178269952b98cbbea7ca935d890527ae27                                                                                      0.0s 
 => [internal] load build context                                                                                                                                                                                 0.7s 
 => => transferring context: 56.61MB                                                                                                                                                                              0.7s 
 => CACHED [stage-1 1/2] FROM docker.io/library/nginx:1.15.8-alpine@sha256:e0292d158b6b353fde34909243a4886977cb9d1abb8a8a5fef9e0ff7138dd3e2                                                                       0.0s 
 => CACHED [builder 2/5] WORKDIR /app                                                                                                                                                                             0.0s 
 => [builder 3/5] COPY . .                                                                                                                                                                                        0.2s 
 => [builder 4/5] RUN npm install                                                                                                                                                                               107.7s 
 => [builder 5/5] RUN npm run build --prod                                                                                                                                                                       25.2s 
 => => # Compiling @angular/forms : es2015 as esm2015
 => => # Compiling @angular/common/http : es2015 as esm2015
 => => # Compiling @angular/animations : es2015 as esm2015
 => => # Compiling @angular/animations/browser : es2015 as esm2015
 => => # Compiling @angular/platform-browser/animations : es2015 as esm2015                                                                                                                                            
 => => # Compiling @angular/cdk/platform : es2015 as esm2015                   <<<  Stays on this for a few minutes

#11 6.689 Compiling @angular/core : es2015 as esm2015
#11 11.18 Compiling @angular/common : es2015 as esm2015
#11 12.36 Compiling @angular/platform-browser : es2015 as esm2015
#11 13.77 Compiling @angular/platform-browser-dynamic : es2015 as esm2015
#11 16.49 Compiling @angular/forms : es2015 as esm2015
#11 18.64 Compiling @angular/common/http : es2015 as esm2015
...
...
#11 55.01 Compiling primeng/api : es2015 as esm2015
#11 55.95 Compiling primeng/accordion : es2015 as esm2015
#11 57.79 Compiling primeng/inputtext : es2015 as esm2015
#11 58.26 Compiling primeng/dom : es2015 as esm2015
#11 59.12 Compiling primeng/button : es2015 as esm2015
#11 59.84 Compiling primeng/utils : es2015 as esm2015
#11 216.0 Compiling primeng : es2015 as esm2015
#11 244.6 Generating ES5 bundles for differential loading...
#11 534.7 An unhandled exception occurred: Call retries were exceeded
#11 534.7 See "/tmp/ng-lcHnam/angular-errors.log" for further details.
#11 534.7 npm ERR! file sh
#11 534.7 npm ERR! code ELIFECYCLE
#11 534.7 npm ERR! errno ENOENT
#11 534.7 npm ERR! syscall spawn
#11 534.7 npm ERR! serenity@9.0.0 build: `ng build`
#11 534.7 npm ERR! spawn ENOENT
#11 534.7 npm ERR!
#11 534.7 npm ERR! Failed at the serenity@9.0.0 build script.
#11 534.7 npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
#11 534.7
#11 534.7 npm ERR! A complete log of this run can be found in:
#11 534.7 npm ERR!     /root/.npm/_logs/2020-11-27T10_25_28_611Z-debug.log
------
failed to solve with frontend dockerfile.v0: failed to build LLB: executor failed running [/bin/sh -c npm run build --prod]: runc did not terminate sucessfully

在此处输入图像描述

在此处添加 package.json 内容(编辑 #1)。

{
  "name": "serenity",
  "version": "9.0.0",
  "license": "PrimeNG Commercial",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "9.0.4",
    "@angular/cdk": "9.1.0",
    "@angular/common": "9.0.4",
    "@angular/compiler": "9.0.4",
    "@angular/core": "9.0.4",
    "@angular/forms": "9.0.4",
    "@angular/material": "^9.1.0",
    "@angular/platform-browser": "9.0.4",
    "@angular/platform-browser-dynamic": "9.0.4",
    "@angular/router": "9.0.4",
    "@aspnet/signalr": "^1.1.4",
    "@fullcalendar/core": "4.0.2",
    "@fullcalendar/daygrid": "4.0.1",
    "@fullcalendar/interaction": "4.0.2",
    "@fullcalendar/timegrid": "4.0.1",
    "@handsontable/angular": "^5.1.1",
    "@mdi/svg": "^5.3.45",
    "@types/leaflet-draw": "^1.0.2",
    "@types/plotly.js": "^1.50.12",
    "chart.js": "2.7.3",
    "d3": "^5.16.0",
    "font-awesome": "4.7.0",
    "handsontable": "^7.4.2",
    "intl": "1.2.5",
    "leaflet": "^1.6.0",
    "leaflet-draw": "^1.0.4",
    "leaflet-sidebar-v2": "^3.2.2",
    "leaflet.control.layers.tree": "^1.0.0",
    "leaflet.glify": "^3.0.0",
    "material-design-icons": "^3.0.1",
    "plotly.js-dist": "^1.54.1",
    "primeflex": "1.0.0",
    "primeng": "9.0.1",
    "prismjs": "1.15.0",
    "quill": "1.1.8",
    "rxjs": "6.5.4",
    "three": "^0.117.1",
    "web-animations-js": "github:angular/web-animations-js#release_pr208",
    "xlsx": "^0.16.2",
    "zone.js": "0.10.2"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "0.900.4",
    "@angular/cli": "9.0.4",
    "@angular/compiler-cli": "9.0.4",
    "@angular/language-service": "9.0.4",
    "@types/jasmine": "3.5.7",
    "@types/jasminewd2": "2.0.8",
    "@types/leaflet": "^1.5.17",
    "@types/node": "12.12.29",
    "codelyzer": "5.2.1",
    "jasmine-core": "3.5.0",
    "jasmine-spec-reporter": "4.2.1",
    "karma": "4.3.0",
    "karma-chrome-launcher": "3.1.0",
    "karma-coverage-istanbul-reporter": "2.1.1",
    "karma-jasmine": "2.0.1",
    "karma-jasmine-html-reporter": "1.5.2",
    "protractor": "5.4.3",
    "ts-node": "8.3.0",
    "tslint": "5.18.0",
    "typescript": "3.7.5"
  }
}

它在 angular-errors.log 中报告的错误是:

[error] Error: Call retries were exceeded
    at ChildProcessWorker.initialize (c:\development\gems\Frontend_Serenity_A9_SLIM\Frontend_Serenity_A9\node_modules\jest-worker\build\workers\ChildProcessWorker.js:193:21)
    at ChildProcessWorker.onExit (c:\development\gems\Frontend_Serenity_A9_SLIM\Frontend_Serenity_A9\node_modules\jest-worker\build\workers\ChildProcessWorker.js:263:12)
    at ChildProcess.emit (events.js:203:13)
    at Process.ChildProcess._handle.onexit (internal/child_process.js:272:12)

我什至不需要 docker 进程(更新),它只是在“ng build”命令期间执行此操作。我也增加了节点的内存大小。仍然没有运气。

标签: angulardockerdockerfile

解决方案


推荐阅读