Worker terminated due to reaching memory limit: JS heap out of memory

Question

After upgrading my angular 10 to angular 13, I got this error after using the command ng serve.

⠧ Generating browser application bundles (phase: building)...events.js:377
      throw er; // Unhandled 'error' event
      ^

Error [ERR_WORKER_OUT_OF_MEMORY]: Worker terminated due to reaching memory limit: JS heap out of memory
    at new NodeError (internal/errors.js:322:7)
    at Worker.[kOnExit] (internal/worker.js:276:26)
    at Worker.<computed>.onexit (internal/worker.js:203:20)
Emitted 'error' event on Worker instance at:
    at Worker.[kOnExit] (internal/worker.js:276:12)
    at Worker.<computed>.onexit (internal/worker.js:203:20) {
  code: 'ERR_WORKER_OUT_OF_MEMORY'
}

Already tried to increase the memory limit of Node and installing the latest version of Node.

My node version is v14.18.1 and my npm version is 6.14.15. This problem didn't happen with angular 12 or 11.

Ogrady

I up-voted your question because even though Felix says it's been asked many times, it was never asked in relation to Angular or 'npm build'. If not for your question (and Felix's answer), I would still be searching for a solution. – Patagium

Thank you for your attention. Still not sure what is causing the problem, maybe I should remove some of the dependencies from package.json, maybe one of them is causing the problem. – Ogrady

Felix's solution solved the issue for me. Do you still get the same error output when you use his build command? Also, did you try increasing max_old_space_size further. See: https://mcmap.net/q/99045/-how-do-i-determine-the-correct-quot-max-old-space-size-quot-for-node-js – Patagium

What Node sass version are you using ? – Flageolet

Did anyone find the solution? I tried Felix's solution but didn't work for me. William, could you please explain if you found the solution for the same? – Roundabout

Answer 1

I am sure it was asked and answered many times, but change package.json to define build as

"build": "rimraf dist && node --max_old_space_size=8192 ./node_modules/@angular/cli/bin/ng build"

Cirque

Sorry, unfortunately this did not work, I could share my dependency package if it is of any help. – Ogrady

Didn't work for me too. – Roundabout

Answer 2

It is very odd that no one is mentioning a clear direct solution to this issue, in my case increasing the node js memory allocation was not the answer

The issue apparently has to do with styles especially when using Sass, there are two things you need to clarify

1- You are using the proper node sass version along with node js version

2-if step one didn't resolve your issue them move to dart sass, Replace any import in sass file to use ! The new @use is similar to @import . but has some notable differences: The file is only imported once, no matter how many times you @use it in a project. Variables, mixins, and functions (what Sass calls "members") that start with an underscore (_) or hyphen (-) are considered private, and not imported

Once I have applied these my issue was gone

Flageolet

how do you do step 1, can you clarify? I don't see anything related to SASS in my package.json – Sturges

Hi Chris as I explained it was happening for my case, there could be other triggering factors but even thought if you are not using sass examine your css files are the case or not , just try build without it the css to see if it is passing or not, there is no direct answer here it is just trial and error – Flageolet

Answer 3

Incase anyone comes looking for an answer on this thread, I solved it by adding the below in the package.json file -

"scripts": {
  "ng": "node --max_old_space_size=4096 ./node_modules/.bin/ng",
}

Found the answer on GitHub - https://github.com/nrwl/nx/issues/1110

Jaclin

Answer 4

Sometimes, you need to check the peer dependencies in the package-lock.json file. It's possible that some packages are still depending on a lower Angular version, so they need to be upgraded to match your Angular version.

Jen