首页 > 解决方案 > AWS Code Pipeline 构建失败,模块构建失败

问题描述

我的 Angular 项目似乎突然无法在 AWS Code Build 上构建。我什至在对项目进行更改之前恢复到提交(这些更改无论如何都不会影响包或构建命令,但我认为我会以防万一发生了变化)。当我ng build --prod在我的机器上使用它构建时,它构建得很好,但是当 AWS Code Build 在管道执行期间运行时,它会抛出这个错误:

Error: ./src/main.ts
Module build failed (from ./node_modules/@ngtools/webpack/src/ivy/index.js):
TypeError: angularCompiler.getResourceDependencies(...) is not a function or its return value is not iterable
    at getDependencies (/codebuild/output/src145253754/src/node_modules/@ngtools/webpack/src/ivy/plugin.js:261:56)
    at /codebuild/output/src145253754/src/node_modules/@ngtools/webpack/src/ivy/plugin.js:374:20
    at analyzingFileEmitter (/codebuild/output/src145253754/src/node_modules/@ngtools/webpack/src/ivy/plugin.js:307:20)
    at process._tickCallback (internal/process/next_tick.js:68:7)
 @ multi ./src/main.ts main[0]

Error: ./src/polyfills.ts
Module build failed (from ./node_modules/@ngtools/webpack/src/ivy/index.js):
TypeError: angularCompiler.getResourceDependencies(...) is not a function or its return value is not iterable
    at getDependencies (/codebuild/output/src145253754/src/node_modules/@ngtools/webpack/src/ivy/plugin.js:261:56)
    at /codebuild/output/src145253754/src/node_modules/@ngtools/webpack/src/ivy/plugin.js:374:20
    at analyzingFileEmitter (/codebuild/output/src145253754/src/node_modules/@ngtools/webpack/src/ivy/plugin.js:307:20)
    at process._tickCallback (internal/process/next_tick.js:68:7)
 @ multi ./node_modules/@angular-devkit/build-angular/src/webpack/es5-polyfills.js zone.js/dist/zone-legacy ./src/polyfills.ts polyfills-es5[2]



[Container] 2021/01/23 16:26:06 Command did not exit successfully ng build --prod exit status 1
[Container] 2021/01/23 16:26:06 Phase complete: BUILD State: FAILED
[Container] 2021/01/23 16:26:06 Phase context status code: COMMAND_EXECUTION_ERROR Message: Error while executing command: ng build --prod. Reason: exit status 1

这是 package.json 文件:

{
  "name": "kingand-queen",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "dev": "eslint 'src/**/*.ts' && ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "eslint 'src/**/*.ts'",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^10.0.14",
    "@angular/cdk": "^9.2.4",
    "@angular/common": "^10.0.14",
    "@angular/compiler": "^10.0.14",
    "@angular/core": "^10.0.14",
    "@angular/flex-layout": "^10.0.0-beta.32",
    "@angular/forms": "^10.0.14",
    "@angular/google-maps": "^10.2.7",
    "@angular/localize": "^10.0.14",
    "@angular/material": "^9.1.0",
    "@angular/platform-browser": "^10.0.14",
    "@angular/platform-browser-dynamic": "^10.0.14",
    "@angular/router": "^10.0.14",
    "@mdi/font": "^5.8.55",
    "@ng-bootstrap/ng-bootstrap": "^6.1.0",
    "@syncfusion/ej2-angular-calendars": "^18.3.48",
    "@syncfusion/ej2-material-theme": "~17.2.48",
    "@types/googlemaps": "3.39.14",
    "aos": "^2.3.4",
    "bootstrap": "^4.5.3",
    "component": "^1.1.0",
    "cookieconsent": "^3.1.1",
    "hammerjs": "^2.0.8",
    "jquery": "^3.4.1",
    "moment": "^2.29.1",
    "ng-gallery": "^5.0.0",
    "ng-recaptcha": "^5.0.0",
    "ngx-cookie-service": "^10.1.1",
    "ngx-cookieconsent": "^2.2.3",
    "ngx-gallery": "^5.10.0",
    "ngx-lightbox": "^2.2.2",
    "ngx-socket-io": "^3.2.0",
    "rxjs": "~6.5.4",
    "tslib": "^1.14.1",
    "zone.js": "~0.10.2"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^0.901.12",
    "@angular-eslint/eslint-plugin": "0.0.1-alpha.32",
    "@angular/cli": "^10.2.0",
    "@angular/compiler-cli": "^10.0.14",
    "@angular/language-service": "^10.0.14",
    "@ngrx/schematics": "^9.1.0",
    "@types/aos": "^3.0.3",
    "@types/jasmine": "^3.5.14",
    "@types/jasminewd2": "~2.0.3",
    "@types/jquery": "^3.5.4",
    "@types/node": "^12.19.6",
    "@typescript-eslint/eslint-plugin": "^3.10.1",
    "@typescript-eslint/parser": "^3.10.1",
    "codelyzer": "^5.1.2",
    "eslint": "^7.13.0",
    "jasmine-core": "~3.5.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~4.4.1",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage-istanbul-reporter": "~2.1.0",
    "karma-jasmine": "~3.0.1",
    "karma-jasmine-html-reporter": "^1.4.2",
    "node-sass": "^4.14.1",
    "protractor": "~5.4.3",
    "ts-node": "~8.3.0",
    "tslint": "^6.1.3",
    "typescript": "^3.9.7"
  }
}

这是我的 tsconfig.json:

{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "downlevelIteration": true,
    "experimentalDecorators": true,
    "module": "esnext",
    "moduleResolution": "node",
    "importHelpers": true,
    "target": "es2015",
    "lib": [
      "es2018",
      "dom"
    ]
  },
  "angularCompilerOptions": {
    "fullTemplateTypeCheck": true,
    "strictInjectionParameters": true
  }
}

这是我的 tsconfig.app.json:

{
  "extends": "./tsconfig.json",
  "compilerOptions": {
    "outDir": "./out-tsc/app",
    "types": []
  },
  "files": [
    "src/main.ts",
    "src/polyfills.ts"
  ],
  "include": [
    "src/**/*.d.ts"
  ]
}

最后,我的 buildspec.yml:

version: 0.2

phases:
  install:
    runtime-versions:
      nodejs: 10
    commands:
      - echo Installing angular cli...
      - npm install -g @angular/cli
      - yarn add @angular-devkit/build-angular --dev
  build:
    commands:
      - echo Build started...
      - ng build --prod
artifacts:
  files:
    - '**/*'
  base-directory: dist/KingandQueen

现在我不知道为什么会突然发生这种情况,我过去已经构建了大约 50 次项目,直到今天都没有出现任何问题,而没有故意执行可能导致此问题的更新。我已经搜索了 GitHub 错误日志和堆栈溢出,但在这个问题上找不到任何东西,所以任何关于这里问题的想法都将不胜感激。

标签: angulartypescriptaws-codepipelineaws-codebuild

解决方案


经过数小时扫描 GitHub、stack-overflow 和所有其他各种搜索结果后,@ngtools/webpack/src/ivy/plugin.js我发现了一个可能与我有类似问题的人的结果......然而,这可能是一个延伸,因为他似乎只在他/她的本地计算机,并且仅在运行 npm audit fix 时(npm audit fix angular 10.0.1 后出现错误)。这是一篇最近的帖子,所以我假设它一定是最近的包问题或依赖冲突,最有可能与@ngtools/webpack&有关@angular/compiler。然而,这是基于日志的一种猜测,但是在查看我的本地机器时,文件抱怨node_modules/@ngtools/webpack/src/ivy/plugin.js不存在尚未完美构建。因此,经过数小时或删除、更新和降级各种包,删除我的 node_modules 并重建我的 package-lock.json 文件似乎没有任何工作,但它在我的机器上一直运行良好,无论我做了什么 package.json 更改。所以我求助于我的 buildspec.yml,在反复试验后奇迹般地解决了构建问题。这是我的工作构建规范:

version: 0.2

phases:
  install:
    runtime-versions:
      nodejs: 10
    commands:
      - echo Installing source NPM dependencies...
      - npm install -y npm@latest
      - npm install -g @angular/cli
      - rm package-lock.json
    pre_build:
      commands:
      - npm install
  build:
    commands:
      - echo Build started...
      - ng build --prod
artifacts:
  files:
    - '**/*'
  base-directory: dist/KingandQueen

我相信,并且我在这里很容易被误导,由于某种原因@angular/cli,在舞台上安装的最新版本install导致了问题,因此在安装阶段手动删除 package-lock.json 确保了全新安装并npm install确保了package-lock.json 是新鲜制作的。

然而,我仍然不完全处于循环中,但在检查时,它似乎在我的 AWS 账户中用 angular 困扰着我所有的代码管道,该账户具有多个不同的 angular 项目。确实很奇怪,在过去 6 个月(项目的 50 多个版本)没有大惊小怪之后,它基本上是凭空出现的。无论如何都很好地了解那个问题......我希望这对可能遇到这个问题的其他人有所帮助。


推荐阅读