ng build fail with 'JavaScript heap out of memory' with patch 6.0.3

[ArnaudBarre]

Versions

Angular CLI: 6.0.3
Node: 8.11.1
OS: darwin x64 (MacBook Pro 8Go RAM)
Angular: 6.0.2
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router, upgrade
 
Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.6.3
@angular-devkit/build-angular     0.6.3
@angular-devkit/build-optimizer   0.6.3
@angular-devkit/core              0.6.3
@angular-devkit/schematics        0.6.3
@angular/cli                      6.0.3
@ngtools/webpack                  6.0.3
@schematics/angular               0.6.3
@schematics/update                0.6.3
rxjs                              6.1.0
typescript                        2.7.2
webpack                           4.8.3

Repro steps

ng build --prod

Observed behavior

92% chunk asset optimization UglifyJSPlugin
[.. waiting for long time]
FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory

Desired behavior

Build works

Mention any other details that might be useful (optional)

Back to 6.0.1 and 0.6.1 like few days ago works. For the moment I didn't change the default memory allocate to node.

I experience the same issue in some kind:

Angular CLI: 6.0.3
Node: 9.2.0
OS: linux x64
Angular: 6.0.1
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, platform-server, router

Package                            Version
------------------------------------------------------------
@angular-devkit/architect          0.6.1
@angular-devkit/build-angular      0.6.1
@angular-devkit/build-optimizer    0.6.1
@angular-devkit/core               0.6.3
@angular-devkit/schematics         0.6.3
@angular/cdk                       6.0.2
@angular/cli                       6.0.3
@angular/flex-layout               6.0.0-beta.15
@angular/material                  6.0.2
@angular/material-moment-adapter   6.0.2
@ngtools/webpack                   6.0.1
@schematics/angular                0.6.3
@schematics/update                 0.6.3
rxjs                               6.1.0
typescript                         2.7.2
webpack                            4.8.3

The command to build:

node --max_old_space_size=12000 ./node_modules/.bin/ng build --configuration=$ENV \
            --prod --source-map=$useSourceMaps \
            --i18nFile=src/locale/messages.$lang.xtb \
            --i18nFormat=xtb \
            --i18n-locale=$locale \
            --baseHref=/$lang/ \
            --outputPath=dist/$ENV/$lang \
            --deployUrl=$deployUrl/$lang

I assigned a lot of memory but it hangs at building 67%.. Also I saw using it up to 10GB of RAM when manually monitoring with htop.. This is not very accurate ofcourse but indicates a problem if you ask me.

This issue makes it impossible to deploy... Is there a downgrade guide back to angular 5 or did I end up in a new angular "adventure"?

[clydin]

Can you try with node v10? There are known nodeJS performance issues with Map/Set (used heavily within webpack internally) in versions higher than v8.9.4 and less then v10.

A part of my issue seems related to #9779
When I set extractCss to false within angular.json it continues but then gets stuck at UglifyJSPlugin...

Also installing v10 doesnt make a difference. Downgrading to angular 5 again.

It never ceases to amaze me that this javascript community produces a package that upgrades a dependency with a major version without bumping their own major version. Angular may be a nice project and well maintained and follow best practices like semversioning AND stick by the rules that come with the convention but depending on packages that dont follow these practices makes it just as unstable as any other average javascript package..

[ArnaudBarre]

After few tests I downgrade to 6.0.0 and set sourceMap to false. And in fact upgrading to node 10 helped, but I still see a 2x to 3x times increase in build time between 6.0.0 and 6.0.1.

[th0r]

Same issue here: after upgrading Angular from v5.2.8 to v6.0.3 production bundle (aot, unminified) build time/peak memory usage changed from 1.22gb / 54 seconds to 2.91gb / 114 seconds (+138% in memory usage and +111% of build time). I even had to add --max_old_space_size=8192 node flag because compilation process started failing with out of memory error.

Here is the package.json diff:

-    "@angular/animations": "5.2.8",
+    "@angular/animations": "6.0.3",
-    "@angular/common": "5.2.8",
+    "@angular/common": "6.0.3",
-    "@angular/compiler": "5.2.8",
+    "@angular/compiler": "6.0.3",
-    "@angular/compiler-cli": "5.2.8",
+    "@angular/compiler-cli": "6.0.3",
-    "@angular/core": "5.2.8",
+    "@angular/core": "6.0.3",
-    "@angular/forms": "5.2.8",
+    "@angular/forms": "6.0.3",
-    "@angular/http": "5.2.8",
+    "@angular/http": "6.0.3",
-    "@angular/platform-browser": "5.2.8",
+    "@angular/platform-browser": "6.0.3",
-    "@angular/platform-browser-dynamic": "5.2.8",
+    "@angular/platform-browser-dynamic": "6.0.3",
-    "@angular/router": "5.2.8",
+    "@angular/router": "6.0.3",
-    "@angular/upgrade": "5.2.8",
+    "@angular/upgrade": "6.0.3",
-    "@ngtools/webpack": "1.10.2",
+    "@ngtools/webpack": "6.0.3",
-    "ngx-infinite-scroll": "0.8.3",
+    "ngx-infinite-scroll": "6.0.0",
-    "rxjs": "5.5.6",
+    "rxjs": "6.2.0",
-    "typescript": "2.6.2",
+    "typescript": "2.7.2",
-    "@angular/cli": "1.7.4",
+    "@angular/cli": "6.0.3",
+    "@angular-devkit/build-angular": "0.6.3"

We're using custom webpack configuration with AngularCompilerPlugin from @ngtools/webpack.
Node version is 8.11.2.
Webpack version is 4.8.3.

[clydin]

@th0r Can you try with webpack 4.6?

[th0r]

@clydin same out of memory error with Webpack 4.6.
Notice that I used webpack 4.8.3 in both cases previously - it worked fine before Angular upgrade.

[th0r]

@clydin by the way I used Node v8.11.2. After upgrading to Node v10.1.0 results are 2.45gb / 53 seconds i.e. memory consumption is still very high (+101%) but build time became almost identical to what I had before.

[clydin]

@th0r That's good to hear at least the build time is better. Is that with webpack 4.6 or 4.8.3?

[th0r]

This is with webpack 4.8.3. Downgrading to 4.6.0 doesn't reduce memory consumption.

[filipesilva]

@th0r can you also try with Build Optimizer turned off in CLI 1.x versus 6.x please?