Angular 9 - NGCC 因未處理的異常而失敗

Question

在將依賴項升級到 Angular 9（並執行必要的代碼更改）后構建應用程序會引發錯誤：

編譯@angular/animations: es2015 as esm2015 編譯@angular/animations: es2015 as esm2015 編譯@angular/core: es2015 as esm2015 編譯@angular/core: es2015 as esm2015 編譯@angular/core: es2015 as esm2015 Error : Error on worker #5: TypeError: 無法讀取 null 的屬性 'fileName'

然后它繼續拋出以下錯誤：

編譯@angular/core: es2015 as esm2015 編譯@angular/compiler/testing: es2015 as esm2015 編譯@angular/core: es2015 as esm2015錯誤：試圖用一個寫node_modules/@angular/core/core.d.ts.__ivy_ngcc_bak ngcc 備份文件，但它已經存在，所以不寫入，也不備份，node_modules/@angular/core/core.d.ts。

此錯誤可能是因為兩個或多個入口點重疊並且 ngcc 被要求多次處理某些文件。 您應該檢查此包中的其他入口點並設置配置以忽略任何您不使用的入口點。

編譯@angular/core: es2015 as esm2015 發生未處理的異常：NGCC 失敗。

Answer 1

我和我的同事開發人員在我們的本地主機機器上遇到了這個問題（NGCC 失敗）。

重要的是要注意 dev 和 prod 機器運行良好。

為了解決這個問題，我們遵循了以下步驟：

1. 在tsconfig.json中，在angularCompilerOptions中已設置（“ enableIvy ”：false）
2. 將nodeJS更新到最新版本：（執行node -v返回v14.3.0）
3. 已刪除node_modules文件夾：（執行"rm.\node_modules\" [on windows]，確保已成功刪除）
4. 已安裝軟件包：（執行npm i ）
5. 在這里，該項目已准備好構建。 它現在可以毫無錯誤地構建和運行。

我希望這可以幫助您和其他人在這種情況下。

Answer 2

在我的特殊情況下， @angular-devkit/build-angular在運行npm 審核后更新為“ ^0.1001.2 ” （這個版本好像屬於angular 10，而不是本地項目的angular版本（v9.1.7））

恢復此更改后，一切都重新開始工作：

“@angular-devkit/build-angular”：“ ~0.901.6 ”

Answer 3

使用終端/cmd，

第一步：

ng update @angular/cli @angular/core

第二步：

ng update

第三步：

ng serve

固定我的。

注意引導文件夾中的自定義 css 文件可能會被刪除。 之前備份它們並在更新后將它們放回去！

Answer 4

嘗試刪除node_modules文件夾並再次運行安裝：

rm -rf node_modules

npm install

對我來說它已經解決了這個問題。

Answer 5

這個問題是因為您可能在任何端口上運行您的應用程序，並且 angular ngcc 被分配了一個特定的進程 id，該進程 id 被指定並鎖定在\node_modules\@angular\compiler-cli\ngcc中名為__ngcc_lock_file__的文件中。 如果您正在執行硬系統關閉或操作系統崩潰，此鎖定文件將在 node_modules 中。 一旦您打開機器並嘗試再次啟動應用程序，angular cli 將檢查此鎖定文件並嘗試查找文件中指定的進程 ID。 大多數情況下，由於您重新啟動了完整的機器，因此該進程 ID 會丟失，並且會引發此錯誤。

解決方案 1 。 刪除node_modules並安裝 npm

解決方案 2 。 智能解決方案 - 刪除鎖定文件如下。

Go to `\node_modules\@angular\compiler-cli\ngcc`

找到名為__ngcc_lock_file__的文件刪除它。 完畢。

快樂的黑客

Answer 6

就我而言，添加enableIvy: false並沒有解決問題，這與 vsCode 的 Angular 語言服務擴展有關（看起來它實際上並沒有考慮到參數）。

解決方案是降級擴展版本。 （v12.0.0 --> v11.2.14 看這里知道如何）

Answer 7

在 tsconfig.json 中設置 "enableIvy": false 確實修復了該特定錯誤。 常春藤不是應該已經可以使用了嗎？

我在此處輸入鏈接描述@clement911答案中找到了這個答案，經過大量測試后它對我有用

Answer 8

在"postinstall": "ngcc"添加到"scripts"幫助我解決了這個問題

Answer 9

使用node -v檢查您的 node.js 版本。 並檢查 Angular 9 是否兼容。 將 node.js 更新到最新的 LTS 版本 (12.8.1) 對我有用。 我用 nvm（節點版本管理器）做到了這一點。 在這里找到了一個很好的說明。

Answer 10

• 我從package.json中刪除了tslib.js
• 刪除了 package-lock.json
• 刪除了 node_modules 文件夾
• npm i
• ng serve

為我工作

Answer 11

好吧，在我的情況下，我試圖用新版本的節點運行舊版本的 angular 項目。 我這樣做了：

刪除所有現有的結節模塊。

rm -rf node_modules

將節點 js 更新到最新

npm update
npm install

將 angular 項目版本更新到最新

ng update @angular/core

將項目 cli 更新到最新

ng update @angular/cli

現在開始項目

ng-serve

Answer 12

如果版本不匹配.. 檢查第一個版本節點 js 和 angular js

然后寫： npm install =>: ng serve

如果有端口問題： ng server --port 4201

Answer 13

我必須將 go 放入我的 tsconfig.spec.json 文件並添加

"angularCompilerOptions": {
    "enableIvy": false
}

它已經在我的 tsconfig.json 文件中。

Answer 14

在這個聚會上有點晚了，但是對於舊的 Angular 版本，我設法通過 VS 擴展解決了這個問題。

Angular CLI：6.1.5 節點：8.11.4

視覺工作室，angular 擴展

角度視圖引擎

擴展 -> Angular 語言服務(v12.0.2) -> 擴展設置

• 在 Workspace 下，勾選“User Legacy View Engine language service”。

Answer 15

我有類似的問題，

在我的情況下，將 NodeJS 更新到新版本有幫助。

Answer 16

我通常建議人們在每次成功部署（本地）后手動備份項目，因為當您遇到此類問題（與NGCC errors相關的所有內容）時，您可以硬刪除node_modules文件夾並從last backup中恢復它。 然后再次構建。

有時，當您負擔不起將nodeJS更新到最新版本時，此解決方案將是完美的。

Answer 17

在我的情況下，我從 npm 安裝了 angular-font-awesome package 然后引導，它可能會發生沖突，我只是刪除以前安裝的 angular-font-awesome 然后完成ng build

Answer 18

我在運行ionic build時遇到了這個問題，而項目與我的同事一起構建得很好。 所以我們運行ng -v來比較我們的包。 原來我有更高版本的@angular-devkit/build-angular 、 @angular-devkit/build-optimizer和@angular-devkit/build-webpack ，它們都是 0.1001.2 版本——我們的項目運行的是 0.901。 8.

所以我運行npm uninstall @angular-devkit/build-angular 0.1001.2來卸載它，並npm install @angular-devkit/build-angular 0.901.8來降級。 再次運行ng -v時，其他 2 個也已降級。

最后， ionic build成功了，我們從此過上了幸福的生活。 直到我們遇到不同的問題。 我們項目的工作包

Answer 19

我得到了這個和其他錯誤，因為我試圖更新 Angular 9 應用程序的一些邊緣庫。 隨后在編譯過程中出現的錯誤是毫無意義的，因為它們無助於糾正錯誤。

刪除“node_modules”和“npm i”的解決方案不起作用，因為即使我有原始的 package.json，“npm i”仍然安裝不同版本的庫 - 而不是原始庫。 最初 node_modules 中的庫到底是什么尚不清楚。

唯一有幫助的解決方案是從備份恢復 node_modules 。

否則，如果您需要更新應用程序中的庫，請假並准備一些抗抑郁葯，但在升級庫后解決無意義的錯誤可能仍然無濟於事。

Answer 20

不存在禁用IVY是最佳解決方案的情況。

對於 windows 用戶：

npm i rimraf -g
rimraf node_modules
npm i

Answer 21

"prettier": "2.2.1"，刪除它，因為它與語義相沖突。

Answer 22

對我來說，原來我們使用了 package-lock.json 聲明 package 版本控制一段時間，當我由於合並沖突而試圖刪除它並重新創建它時，發生了錯誤。 當回到舊的 package-lock.json 時，問題就消失了。 於是我開始搜索：

• 比較兩者之間的變化
• 檢查生產中是否也出現問題 - 那么它幾乎不可能是開發依賴
• 整理出不太可能和可能的依賴關系

我最終找到了 Angular 依賴項，更准確地說是在 @angular/material-moment-adapter 收到了從版本 11.2.0 到 11.2.12 的更新（因為我們在 package.json 中允許它）。

Answer 23

嘗試刪除 angular-font-awesome 並再次運行安裝：

npm 卸載 angular-font-awesome ng 添加@fortawesome/angular-fontawesome@0.6.0

在我刪除 fontawesome 后問題就解決了，現在 Material Icons 是我的圖標選擇。 但我應該感謝 Font Awesome 多年來提供的免費真棒圖標:)

Answer 24

就我而言，問題是我的服務器沒有足夠的 RAM (1 GB)，這似乎不足以處理構建。 增加到2 GB后，問題就解決了。

希望這可以幫助任何人。

Answer 25

適用於使用 vscode 1.62 或更高版本的用戶。 這些答案都沒有幫助我。 我昨天（2021 年 10 月 11 日）更新了 vscode，由於某種原因，我的 Angular 9 項目開始顯示“NGCC 失敗”。 我將 vscode 降級到 1.61.2，一切恢復正常。

Answer 26

不幸的是，上面提供的答案都沒有奏效。

降級typescript （在我的例子中是 4.8 到 4.6）解決了這個問題。

Answer 27

這只為我喚醒了 del node_modules npm install enableIvy:false was not support who uses angular v12 or above

Answer 28

將 tsconfig.json 替換為下面的 json 內容

{
  "compileOnSave": false,
  
  "compilerOptions": {
     "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "module": "esnext",
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "target": "es2015",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2018",
      "dom"
    ]
  },
  "angularCompilerOptions": {
    "fullTemplateTypeCheck": true,
    "strictInjectionParameters": true
  }
}