Increase JavaScript Heap size in create-react-app project

Question

Node features the way to increase the heap size via passing in the --max-old-space-size command line flag. In create-react-app projects everything depends on the use of react-scripts. How can I pass in this parameter in such projects and where should I best do that?

Thank you for help.

Deborahdeborath

Since those scripts are just JS files in a special directory you should be able to call the Node process like you usually do, and pass node_modules/.bin/react-scripts as the argument to it. It is symlinked to the actual script. – Vide

Answer 1

Thanks a lot to @dan-abramov as his comment is the answer! (Give him the vote up in case you come across this).

You can just put e.g. node --max_old_space_size=4096 node_modules/.bin/react-scripts start in there instead of react-scripts start

Deborahdeborath

This is giving an error : basedir=$(dirname.......) line 2 of react scripts. It says missing ) after argument list. PLease help – Braswell

I have same issue, Our ubuntu server ram 1GB so what i need to do ? – Enloe

For smal servers you need put less memory. To me works with --max_old_space_size=256 – Featherstitch

what is 4096 here 4096 GB? – Berkin

This is 4096 MB so 4 GB – Deborahdeborath

this doesn't work for me, it still uses over 1gb of ram (when I set it to 256) and the processor goes to 300+%. Am I missing something? Is there any other way to constrain resource usage? – Gnome

Getting FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory – Muddlehead

Answer 2

"build": "react-scripts --max_old_space_size=4096 build"

This should work

Footwork

what is 4096 here 4096 GB or MB? – Berkin

@vinayakshahdeo it means 4096 MB – Lager

I tried this and didn't work for me even after setting 8 Gb or 12 Gb – Darden

Getting FATAL ERROR: MarkCompactCollector: young object promotion failed Allocation failed - JavaScript heap out of memory – Muddlehead

@Muddlehead , I also ended up with the same FATAL ERROR: MarkCompactCollector How did you resolve it? – Effluvium

@Sandeepsandy I think I fixed all heap out of memory ocurrances by upgrading NodeJs. – Muddlehead

Answer 3

You can disable generation of source maps as described in https://create-react-app.dev/docs/advanced-configuration

Indeed as per the documentation:

When set to false, source maps are not generated for a production build. This solves out of memory (OOM) issues on some smaller machines.

Which is the case when you got an Heap Out Of Memory error

To do so, create a .env file and add GENERATE_SOURCEMAP=false

Gunk

Answer 4

One line answer, run on terminal -> export NODE_OPTIONS=--max_old_space_size=4096

Gerfalcon

Answer 5

If you're using craco build just add the flag in like the below

craco --max_old_space_size=4096 build

Madelle

Answer 6

Add

ENV GENERATE_SOURCEMAP=false

in your docker file. This worked for me.

Thanks!

Bubonocele