Ineffective mark-compacts near heap limit Allocation Angular 8 - JavaScript heap out of memory

Question

42% building 274/275 modules 1 active ...\src\index.js??extracted!D:\Clients\app\node_modules\sass-loader\lib\loader.js??ref--15-3!D:\src\styles.scss <--- Last few GCs --->

[12996:000002DFC57D42F0] 43111 ms: Scavenge 1335.4 (1425.0) -> 1335.3 (1426.0) MB, 2.6 / 0.0 ms (average mu = 0.169, current mu = 0.100) allocation failure [12996:000002DFC57D42F0] 43489 ms: Mark-sweep 1336.2 (1426.0) -> 1335.4 (1425.5) MB, 375.8 / 0.0 ms (average mu = 0.144, current mu = 0.100) allocation failure scavenge might not succeed

<--- JS stacktrace --->

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

0: ExitFrame [pc: 00000257D3FDC5C1] Security context: 0x00b77541e6e9 <JSObject>
1: createNode [000001A31ED4EFF1] [D:\Clients\app\node_modules\typescript\lib\typescript.js:~16489]

[pc=00000257D55AD889](this=0x02b823cedf89 ,kind=275,pos=-=-1,end=-1) 2: createPropertyAssignment [000001A31ED54669] [D:\Clients\app\node_modules\typescript\lib\typescri...

FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory 1: 00007FF76C26DD8A v8::internal::GCIdleTimeHandler::GCIdleTimeHandler+4506 2: 00007FF76C248886 node::MakeCallback+4534 3: 00007FF76C249200 node_module_register+2032 4: 00007FF76C5630DE v8::internal::FatalProcessOutOfMemory+846 5: 00007FF76C56300F v8::internal::FatalProcessOutOfMemory+639 6: 00007FF76C749804 v8::internal::Heap::MaxHeapGrowingFactor+9620 7: 00007FF76C7407E6 v8::internal::ScavengeJob::operator=+24550 8: 00007FF76C73EE3C v8::internal::ScavengeJob::operator=+17980 9: 00007FF76C747B87 v8::internal::Heap::MaxHeapGrowingFactor+2327 10: 00007FF76C747C06 v8::internal::Heap::MaxHeapGrowingFactor+2454 11: 00007FF76C871EA7 v8::internal::Factory::NewFillerObject+55 12: 00007FF76C8EF096 v8::internal::operator<<+73494 13: 00000257D3FDC5C1

I have tried this solution: https://github.com/angular/angular-cli/issues/5618#issuecomment-450151214

i.e.

package.json

"scripts": {
        "ng": "ng",
        "ng-high-memory": "node --max_old_space_size=8000 ./node_modules/@angular/cli/bin/ng",// here
        "start": "ng serve",
        "build:prod": "ng build --configuration=prod",
    },

After that

npm run ng-high-memory --build --prod

But it says

> > metronic-angular@6.0.0 ng-high-memory D:\Clients\app
> > node --max_old_space_size=8000 ./node_modules/@angular/cli/bin/ng
> 
> Available Commands:   add Adds support for an external library to your
> project.   analytics Configures the gathering of Angular CLI usage
> metrics. See https://v8.angular.io/cli/usage-analytics-gathering.  
> build (b) Compiles an Angular app into an output directory named dist/
> at the given output path. Must be executed from within a workspace
> directory.   deploy (d) Invokes the deploy builder for a specified
> project or for the default project in the workspace.   config
> Retrieves or sets Angular configuration values in the angular.json
> file for the workspace.   doc (d) Opens the official Angular
> documentation (angular.io) in a browser, and searches for a given
> keyword.   e2e (e) Builds and serves an Angular app, then runs
> end-to-end tests using Protractor.   generate (g) Generates and/or
> modifies files based on a schematic.   help Lists available commands
> and their short descriptions.   lint (l) Runs linting tools on Angular
> app code in a given project folder.   new (n) Creates a new workspace
> and an initial Angular app.   run Runs an Architect target with an
> optional custom builder configuration defined in your project.   serve
> (s) Builds and serves your app, rebuilding on file changes.   test (t)
> Runs unit tests in a project.   update Updates your application and
> its dependencies. See https://update.angular.io/   version (v) Outputs
> Angular CLI version.   xi18n Extracts i18n messages from source code.
> 
> For more detailed help run "ng [command name] --help"

So how can I run this command properly?

Note: I use the latest Angular i.e. "@angular/core": "^8.2.14", and "@angular/cli": "^8.3.19",

Answer 1

This works for me:

I have updated to the latest Angular like so: ng update @angular/cli@^8 @angular/core@^8

Then

package.json

"scripts": {
    "ng-high-memory": "node --max_old_space_size=8000 ./node_modules/@angular/cli/bin/ng build --configuration=prod",
}

After that:

npm run ng-high-memory

Url: JavaScript heap out of memory

Answer 2

Upgrade the node js version to v12.

Answer 3

You are running out of memory allocated.

In your project directory, run this command.

set NODE_OPTIONS=--max_old_space_size=8192

(This sets 8GB memory allocated).

Then,

ng serve --open OR ng build --prod

Or Use like this,

set NODE_OPTIONS=--max_old_space_size=8192 & ng serve --open

To avoid typing all these together every time we can save this script inside the package.json file.

Inside "scripts": {....}

"scripts": {
    .....
    "mserve":"set NODE_OPTIONS=--max_old_space_size=8192 & ng serve --open"
    }

Then in Terminal, inside your project. Run

npm run mserve

You can rename mserve to anything you want

Answer 4

I used the following command on cmd rather than fixing the memory issue from package.json. And this worked for me.

node --max_old_space_size=8192 node_modules/@angular/cli/bin/ng build --prod 

I was using angular 6, and I didn't have to upgrade to the latest version of angular. This error is not related to the angular version I guess.

Answer 5

On my raspbarry pi model 3, the RAM (1GB) and swap space (1GB) was to small. After increasing the swap space to 10GB, the suggested command "ng-high-memory" worked!

Answer 6

I was getting this error, but in my case, the issue was related to the angular.json settings. It had to do with the "budget" setting.

It was originally like this...

 "budgets": [
                {
                  "type": "initial",
                  "maximumWarning": "2mb",
                  "maximumError": "5mb"
                },
                {
                  "type": "anyComponentStyle",
                  "maximumWarning": "6kb",
                  "maximumError": "10kb"
                }
              ]

After the fix...it looked like this...

    "budgets": [
        {
          "type": "anyComponentStyle",
          "maximumWarning": "6kb"
        }
      ],

Answer 7

export NODE_OPTIONS=--max_old_space_size=8192

export worked for me instead of set. And I ran this from the terminal in the parent directory that contained the test files.

Answer 8

It solved afterIncrease the node max memory size

// terminal
export NODE_OPTIONS=--max_old_space_size=8096

// Windows
set NODE_OPTIONS=--max_old_space_size=8096