angular / angular-cli

CLI tool for Angular
https://cli.angular.io
MIT License
26.73k stars 11.98k forks source link

CLI10: got a few compiler crashes today with "JavaScript heap out of memory" #18034

Closed ldex closed 4 years ago

ldex commented 4 years ago

🐞 Bug report

Command (mark with an x)

Is this a regression?

Yes, the previous version in which this bug was not present was Angular 9 with CLI 9. ### Description

Small project freshly migrated from ng9 to 10, I sometimes get a compiler crash with "JavaScript heap out of memory" during ng serve. It never happened to me before ng 10.

Project is available here: https://github.com/ldex/Angular-Academy-202

🔥 Exception or Error


<--- Last few GCs --->

[1308:00000253CB798AB0] 11379648 ms: Scavenge 2033.1 (2051.3) -> 2032.1 (2051.3) MB, 5.4 / 0.0 ms  (average mu = 0.125, current mu = 0.067) allocation failure
[1308:00000253CB798AB0] 11379665 ms: Scavenge 2033.1 (2051.3) -> 2032.2 (2051.3) MB, 8.2 / 0.1 ms  (average mu = 0.125, current mu = 0.067) allocation failure
[1308:00000253CB798AB0] 11379824 ms: Scavenge 2033.5 (2051.6) -> 2032.6 (2051.6) MB, 5.4 / 0.0 ms  (average mu = 0.125, current mu = 0.067) allocation failure

<--- JS stacktrace --->

==== JS stack trace =========================================

    0: ExitFrame [pc: 00007FF6513377DD]
    1: StubFrame [pc: 00007FF6513388D3]
Security context: 0x00c2be6408d1 
    2: formatLocation(aka formatLocation) [00000377970C75D1] [C:\Users\beep\Desktop\DemoApp\node_modules\webpack\lib\formatLocation.js:~41] [pc=000001471AADB4D8](this=0x012e6a0404b1 ,0x002fb6ac6cd1 
SourceLocation map = 00    3: /* anonymous */(aka /* anonymous */) [000003C749112FE1] [C

FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory
 1: 00007FF65072470F napi_wrap+113583
 2: 00007FF6506CF7D6 v8::base::CPU::has_sse+66646
 3: 00007FF6506D05D6 v8::base::CPU::has_sse+70230
 4: 00007FF650EE42EE v8::Isolate::ReportExternalAllocationLimitReached+94
 5: 00007FF650ECC3C1 v8::SharedArrayBuffer::Externalize+833
 6: 00007FF650D9890C v8::internal::Heap::EphemeronKeyWriteBarrierFromCode+1436 7: 00007FF650DA3B40 v8::internal::Heap::ProtectUnprotectedMemoryChunks+1312
 8: 00007FF650DA0664 v8::internal::Heap::PageFlagsAreConsistent+3204
 9: 00007FF650D95E63 v8::internal::Heap::CollectGarbage+1283
10: 00007FF650D944D4 v8::internal::Heap::AddRetainedMap+2452
11: 00007FF650DB56DD v8::internal::Factory::NewFillerObject+61
12: 00007FF650B1BF61 v8::internal::interpreter::JumpTableTargetOffsets::iterator::operator=+1665
13: 00007FF6513377DD v8::internal::SetupIsolateDelegate::SetupHeap+546637
14: 00007FF6513388D3 v8::internal::SetupIsolateDelegate::SetupHeap+550979
15: 000001471AADB4D8

🌍 Your Environment




Angular CLI: 10.0.0
Node: 12.18.0
OS: win32 x64

Angular: 10.0.0
... animations, cli, common, compiler, compiler-cli, core, forms     
... platform-browser, platform-browser-dynamic, router
Ivy Workspace: Yes

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.1000.0
@angular-devkit/build-angular     0.1000.0
@angular-devkit/build-optimizer   0.1000.0
@angular-devkit/build-webpack     0.1000.0
@angular-devkit/core              10.0.0
@angular-devkit/schematics        10.0.0
@ngtools/webpack                  10.0.0
@schematics/angular               10.0.0
@schematics/update                0.1000.0
rxjs                              6.5.5
typescript                        3.9.5
webpack                           4.43.0

Anything else relevant?

lacolaco commented 4 years ago

Same situation on my personal project which has been created in v10 (not upgrade from v9).

Angular CLI: 10.0.0
Node: 12.14.1
OS: darwin x64

Angular: 10.0.0
... animations, cli, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router
Ivy Workspace: Yes

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.1000.0
@angular-devkit/build-angular     0.1000.0
@angular-devkit/build-optimizer   0.1000.0
@angular-devkit/build-webpack     0.1000.0
@angular-devkit/core              10.0.0
@angular-devkit/schematics        10.0.0
@ngtools/webpack                  10.0.0
@schematics/angular               10.0.0
@schematics/update                0.1000.0
rxjs                              6.5.5
typescript                        3.9.5
webpack                           4.43.0

UPDATE

I've updated Node.js to v14 but it isn't be solved.

mduft commented 4 years ago

I can confirm that node.exe for @ngtools/webpack/src/type_checker_worker.js is growing roughly by a few MB on every single file save/recompile cycle. It went OOM for me after updating to Angular 10 within an hour or so... Its pretty annoying that ng serve crashes due to this every hour. I always wonder why my page still runs an old state until I notice that ng serve went away and the recompile/refresh never happened...

This can easily be reproduced by just saving a file without modifications in VSCode. ng serve will recompile and type_checker_worker grows. It does shrink again, but not by the amount it grew before.

I just hammered CTRL+S a few dozen times. After a while I see this: WARNING in AngularCompilerPlugin: Forked Type Checker exited unexpectedly. Falling back to type checking on main thread. A report JSON is generated (attached).

After that ng serve is super slow (factor 4) and starts to grow. Once it reaches the limit, it crashes and produces the second attached report.

reports.zip

alan-agius4 commented 4 years ago

Most likely this is related to a regression in the compiler which was fixed via https://github.com/angular/angular/pull/37641 and will be available in 10.0.1

JFYI @alxhub

PPInfy commented 4 years ago

WA- https://dev.to/koscheyscrag/fix-of-angular-cli-javascript-heap-out-of-memory-error-while-running-ng-serve--1jjh

AXeL-dev commented 4 years ago

I was able to fix this by downgrading the @angular-devkit package(s) to version 0.803.26 inside package.json

"devDependencies": {
    "@angular-devkit/build-angular": "0.803.26",
    ...
}

(might need to delete or update package-lock.json file too, then update packages using npm install).

Any version above 0.803.26 keeps giving me the "JavaScript heap out of memory" error (on serve or build).

Tested on Angular 8 & 9.

lacolaco commented 4 years ago

It's still happening after upgrading to v10.0.1 but Its frequency is a little down on my environment. We still need more effective fixes. cc/ @alan-agius4

PPInfy commented 4 years ago

The fix is due to come out in 10.1.x as per @alan-agius4 . So lets wait for it or use workarounds as pointed out by me or @AXeL-dev

alan-agius4 commented 4 years ago

@PPInfy, the fix is was referring too, is included in 10.0.1.

@lacolaco, we’ll still continue looking at other possible issues and resolutions.

Nb: using an older version of build-angular might cause undefined behaviour. Angular and Angular CLI version 10 needs @angular-devkit/build-angular version 0.1000.0 or later, using incompatible version is consider unsupported.

PPInfy commented 4 years ago

@alan-agius4 I thought since the issue is open and based on your comment this will come in release 10.1.0 to be precise.

alan-agius4 commented 4 years ago

@PPInfy, sorry I missed a 0 in my above comment. (Which I edited)

Mike-Becatti commented 4 years ago

I'm getting this same error but while running "ng update @angular/core @angular/cli" on a very complex ng9 project. I am using @angular/compiler 10.0.1.

PPInfy commented 4 years ago

try running node --max_old_space_size=2048 ./node_modules/@angular/cli/bin/ng serve

or node --max_old_space_size=2048 ./node_modules/@angular/cli/bin/ng build

Mike-Becatti commented 4 years ago

@PPInfy - If that comment was directed at me, I updated my comment for clarify. I'm getting the error when running the update command, not 'after' on build like I originally said.

PPInfy commented 4 years ago

Try "node --max_old_space_size=2048 ./node_modules/@angular/cli/bin/ng update @angular/core @angular/cli"

alan-agius4 commented 4 years ago

Repro from https://github.com/angular/angular-cli/issues/18070

https://github.com/genielabs/HomeGenie/tree/master/src/homegenie-ui-app

//cc @genemars

Mike-Becatti commented 4 years ago

@PPInfy - When I try that I get the following output:

Using package manager: 'npm' Collecting installed dependencies... Found 48 dependencies. Package '-e' is not a dependency.

kyliau commented 4 years ago

Quick update: We've identified the memory leak in Ivy compiler, and we're currently working on a fix. It'll be out in v10.0.2.

kyliau commented 4 years ago

v10.0.2 is out! I'll close this issue for now. Please open a new issue if you run into other memory issues.

Mike-Becatti commented 4 years ago

@kyliau - I am still getting the out of memory error but it is on the 'update' command instead of on build. Do you want me to create a new issue?

kyliau commented 4 years ago

@AlphaCreative-Mike yes please create a new issue. It'll help us triage and prioritize the issue if you open a new one. Thank you!

cardamon commented 4 years ago

Still getting the exact same issue using 10.0.2:

$ ./node_modules/.bin/ng --version

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/

Angular CLI: 10.0.0
Node: 14.4.0
OS: linux x64

Angular: 10.0.2
... animations, common, compiler, compiler-cli, core, forms
... language-service, localize, platform-browser
... platform-browser-dynamic, router
Ivy Workspace: Yes

Package                            Version
------------------------------------------------------------
@angular-devkit/architect          0.1000.0
@angular-devkit/build-angular      0.1000.0
@angular-devkit/build-ng-packagr   0.1000.0
@angular-devkit/build-optimizer    0.1000.0
@angular-devkit/build-webpack      0.1000.0
@angular-devkit/core               10.0.0
@angular-devkit/schematics         10.0.0
@angular/cdk                       10.0.1
@angular/cli                       10.0.0
@ngtools/webpack                   10.0.0
@schematics/angular                10.0.0
@schematics/update                 0.1000.0
ng-packagr                         10.0.0
rxjs                               6.5.5
typescript                         3.9.5
webpack                            4.43.0 

Using serve, after a couple of recompiles:

<--- Last few GCs --->

[18915:0x5936310]  3270672 ms: Scavenge 2014.4 (2060.9) -> 2002.6 (2060.9) MB, 4.4 / 0.0 ms  (average mu = 0.373, current mu = 0.366) allocation failure 
[18915:0x5936310]  3270717 ms: Scavenge 2017.0 (2060.9) -> 2005.3 (2062.1) MB, 4.7 / 0.0 ms  (average mu = 0.373, current mu = 0.366) allocation failure 
[18915:0x5936310]  3271845 ms: Scavenge 2019.7 (2062.6) -> 2007.9 (2037.6) MB, 36.6 / 0.0 ms  (average mu = 0.373, current mu = 0.366) allocation failure 

<--- JS stacktrace --->

FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory
 1: 0xa2b020 node::Abort() [/home/jakob/.nvm/versions/node/v14.4.0/bin/node]
 2: 0x97a467 node::FatalError(char const*, char const*) [/home/jakob/.nvm/versions/node/v14.4.0/bin/node]
 3: 0xb9e0ee v8::Utils::ReportOOMFailure(v8::internal::Isolate*, char const*, bool) [/home/jakob/.nvm/versions/node/v14.4.0/bin/node]
 4: 0xb9e467 v8::internal::V8::FatalProcessOutOfMemory(v8::internal::Isolate*, char const*, bool) [/home/jakob/.nvm/versions/node/v14.4.0/bin/node]
 5: 0xd3e875  [/home/jakob/.nvm/versions/node/v14.4.0/bin/node]
 6: 0xd3f21b v8::internal::Heap::RecomputeLimits(v8::internal::GarbageCollector) [/home/jakob/.nvm/versions/node/v14.4.0/bin/node]
 7: 0xd4d012 v8::internal::Heap::PerformGarbageCollection(v8::internal::GarbageCollector, v8::GCCallbackFlags) [/home/jakob/.nvm/versions/node/v14.4.0/bin/node]
 8: 0xd4de65 v8::internal::Heap::CollectGarbage(v8::internal::AllocationSpace, v8::internal::GarbageCollectionReason, v8::GCCallbackFlags) [/home/jakob/.nvm/versions/node/v14.4.0/bin/node]
 9: 0xd4f37f v8::internal::Heap::HandleGCRequest() [/home/jakob/.nvm/versions/node/v14.4.0/bin/node]
10: 0xcfa457 v8::internal::StackGuard::HandleInterrupts() [/home/jakob/.nvm/versions/node/v14.4.0/bin/node]
11: 0x104fe4a v8::internal::Runtime_StackGuardWithGap(int, unsigned long*, v8::internal::Isolate*) [/home/jakob/.nvm/versions/node/v14.4.0/bin/node]
12: 0x13a9ed9  [/home/jakob/.nvm/versions/node/v14.4.0/bin/node]
PPInfy commented 4 years ago

Same issue for me as well. [972:000001705E494E80] 167385 ms: Scavenge 1330.4 (1424.2) -> 1329.6 (1424.7) MB, 6.3 / 0.0 ms (average mu = 0.149, current mu = 0.074) allocation failure [972:000001705E494E80] 167396 ms: Scavenge 1330.6 (1424.7) -> 1329.9 (1425.2) MB, 5.3 / 0.0 ms (average mu = 0.149, current mu = 0.074) allocation failure [972:000001705E494E80] 167407 ms: Scavenge 1330.9 (1425.2) -> 1330.2 (1425.7) MB, 4.6 / 0.0 ms (average mu = 0.149, current mu = 0.074) allocation failure

<--- JS stacktrace --->

==== JS stack trace =========================================

0: ExitFrame [pc: 000001746E35C5C1]

Security context: 0x013eeb49e6e9 1: getArg [0000029075F0BD01] [D:\Project\Releases\Spike\Workspace\frontend\node_modules\webpack-sources\node_modules\source-map\lib\util.js:~18] [pc=000001746F512690](this=0x029075f04061 ,aArgs=0x02d6f0d1b031 ,aName=0x013eeb4c9f11 <String[8]: original>,aDefaultValue=0x00bbd42822b1 ) ...

FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory 1: 00007FF70F89DD8A v8::internal::GCIdleTimeHandler::GCIdleTimeHandler+4506 2: 00007FF70F878886 node::MakeCallback+4534 3: 00007FF70F879200 node_module_register+2032 4: 00007FF70FB930DE v8::internal::FatalProcessOutOfMemory+846 5: 00007FF70FB9300F v8::internal::FatalProcessOutOfMemory+639 6: 00007FF70FD79804 v8::internal::Heap::MaxHeapGrowingFactor+9620 7: 00007FF70FD707E6 v8::internal::ScavengeJob::operator=+24550 8: 00007FF70FD6EE3C v8::internal::ScavengeJob::operator=+17980 9: 00007FF70FD77B87 v8::internal::Heap::MaxHeapGrowingFactor+2327 10: 00007FF70FD77C06 v8::internal::Heap::MaxHeapGrowingFactor+2454 11: 00007FF70FEA1EA7 v8::internal::Factory::NewFillerObject+55 12: 00007FF70FF1F096 v8::internal::operator<<+73494 13: 000001746E35C5C1

PPInfy commented 4 years ago

For me the issue got solved by changing "target": "es6" from "target": "es5" in tsconfig.json. However I do have a question. Will this change work in IE11?. And can we do the change to es6? Will it break anything?

JoostK commented 4 years ago

For anyone still seeing issues, it's probably caused by the same issue as reported in #18087. This is being addressed in #18089 that's expected to be in the next release, which should be released over the course of today.

For people using Yarn, you can add a "resolutions" block to force copy-webpack-plugin to 6.0.3 however this must then be removed when upgrading to the next release, as it could introduce compatibility issues in the future.

PPInfy commented 4 years ago

does it change with target as es6? Because I tried many times switching between target es5 and es6 and everytime there is no build/server issue with target as es6 (tsconfig.json -> compilerOptions--> target).

mhov commented 4 years ago

Anyone else's team dead in the water until this releases?

mduft commented 4 years ago

Update worked fine for me, after the update the leak seems gone, processes are growing and shrinking again in a "normal" way I guess :) Only thing observed, incremental build times are way slower now - like 5 seconds instead of 1 second before...

PPInfy commented 4 years ago

@mduft are you using tsconfig.json -> compilerOptions--> target as ES6 ?

mduft commented 4 years ago

@PPInfy we have "target": "es2015", currently...

PPInfy commented 4 years ago

@mduft that is nothing but es6. with target es6/es2015 this is working touchwood. So again this seems like a compiler issuer rather than packager (not an issue with webpack or related modules it looks like) issue. Can someone here confirm this?

PPInfy commented 4 years ago

@alan-agius4 - Please test the fixes with target as es5. I think the root cause might be related to that.

alan-agius4 commented 4 years ago

@PPInfy, what’s the output of ng version?

mduft commented 4 years ago

For me it is:

     _                      _                 ____ _     ___ 
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | | 
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | | 
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/

Angular CLI: 10.0.1
Node: 12.16.1
OS: win32 x64

Angular: 10.0.2
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router
Ivy Workspace: Yes

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.1000.1
@angular-devkit/build-angular     0.1000.1
@angular-devkit/build-optimizer   0.1000.1
@angular-devkit/build-webpack     0.1000.1
@angular-devkit/core              10.0.1
@angular-devkit/schematics        10.0.1
@angular/cdk                      10.0.1
@angular/cli                      10.0.1
@angular/flex-layout              10.0.0-beta.32
@angular/material                 10.0.1
@ngtools/webpack                  10.0.1
@schematics/angular               10.0.1
@schematics/update                0.1000.1
rxjs                              6.6.0
typescript                        3.9.6
webpack                           4.43.0

Note the 10.0.1 versions of all the packages...

JoostK commented 4 years ago

Update worked fine for me, after the update the leak seems gone, processes are growing and shrinking again in a "normal" way I guess :) Only thing observed, incremental build times are way slower now - like 5 seconds instead of 1 second before...

@mduft After which update did you see to start the incremental rebuild time regression? I am trying to figure out if it's due to a change in Angular framework or the CLI. Investigating this without a reproduction is practically impossible I'm afraid, so is it possible to share a reproduction?

PPInfy commented 4 years ago

Angular CLI: 10.0.1 Node: 10.16.3 OS: win32 x64

Angular: 10.0.2 ... animations, common, compiler, compiler-cli, core, forms ... language-service, platform-browser, platform-browser-dynamic ... router Ivy Workspace:

Package Version

@angular-devkit/architect 0.1000.1 @angular-devkit/build-angular 0.1000.1 @angular-devkit/build-ng-packagr 0.1000.1 @angular-devkit/build-optimizer 0.1000.1 @angular-devkit/build-webpack 0.1000.1 @angular-devkit/core 10.0.1 @angular-devkit/schematics 10.0.1 @angular/cdk 10.0.1 @angular/cli 10.0.1 @angular/flex-layout 10.0.0-beta.32 @angular/material 10.0.1 @ngtools/webpack 10.0.1 @schematics/angular 10.0.1 @schematics/update 0.1000.1 ng-packagr 10.0.0 rxjs 6.6.0 typescript 3.9.5 webpack 4.43.0

With this also same situation - OOM.

PPInfy commented 4 years ago

Again with Target ES6 it is working absolutely fine.

mduft commented 4 years ago

I thought it was easy to repro using this project - this commit has the update to 10.0.2 - however switching back to the commit before, it now also takes longer than usual :|

angular-automatic-lock-bot[bot] commented 4 years ago

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.