Cannot build app - Javascript heap out of memory

Is this a bug report?

yes

Did you try recovering your dependencies?

yes

Environment

Environment: OS: macOS High Sierra 10.13.4 Node: 10.0.0 Yarn: 1.6.0 npm: 5.6.0 Watchman: Not Found Xcode: Not Found Android Studio: Not Found

Packages: (wanted => installed) react: ^16.3.2 => 16.3.1 react-dom: ^16.3.2 => 16.3.1 react-scripts: 1.1.4 => 1.1.4

Steps to Reproduce

(Write your steps here:)

1. Have a large app with many files and a lot of dependencies.
2. Try to build (main.js size after a successful build is 2.09 MB)

Expected Behavior

Be able to build app no problem

Actual Behavior

Build failed with error

<--- Last few GCs --->

[68056:0x102802400]   376730 ms: Mark-sweep 1309.1 (1448.0) -> 1309.1 (1450.0) MB, 4215.0 / 0.0 ms  allocation failure GC in old space requested
[68056:0x102802400]   380890 ms: Mark-sweep 1309.1 (1450.0) -> 1309.1 (1433.0) MB, 4159.9 / 0.0 ms  last resort GC in old space requested
[68056:0x102802400]   385073 ms: Mark-sweep 1309.1 (1433.0) -> 1309.1 (1433.0) MB, 4182.4 / 0.0 ms  last resort GC in old space requested


<--- JS stacktrace --->

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

    0: ExitFrame [pc: 0x32a59040427d]
Security context: 0x1249ce5a06a9 <JSObject>
    1: create(this=0x1249ce5844b1 <JSFunction Object (sfi = 0x1249eac93311)>)
    2: push(aka push) [0x1249eac822e1 <undefined>:~5766] [pc=0x32a5909fea61](this=0x1249eac822e1 <undefined>)
    3: visit [0x1249eac822e1 <undefined>:~5587] [pc=0x32a5913a228e](this=0x12499c887781 <TreeWalker map = 0x1249a3691ac1>,node=0x124990db2279 <AST_Binary map = 0x1249f4e3e9...

FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory
 1: node::Abort() [/usr/local/bin/node]
 2: node::FatalTryCatch::~FatalTryCatch() [/usr/local/bin/node]
 3: v8::internal::V8::FatalProcessOutOfMemory(char const*, bool) [/usr/local/bin/node]
 4: v8::internal::Factory::NewStruct(v8::internal::InstanceType, v8::internal::PretenureFlag) [/usr/local/bin/node]
 5: v8::internal::Factory::NewPrototypeInfo() [/usr/local/bin/node]
 6: v8::internal::Map::GetOrCreatePrototypeInfo(v8::internal::Handle<v8::internal::JSObject>, v8::internal::Isolate*) [/usr/local/bin/node]
 7: v8::internal::Map::GetObjectCreateMap(v8::internal::Handle<v8::internal::HeapObject>) [/usr/local/bin/node]
 8: v8::internal::Runtime_ObjectCreate(int, v8::internal::Object**, v8::internal::Isolate*) [/usr/local/bin/node]
 9: 0x32a59040427d
error Command failed with exit code 1.

Things I have tried: using GENERATE_SOURCEMAP=false to build (this was mentioned in an issue). This worked for a while but then started to fail again as the app grew.

Code splitting using react-loadable to code split on routes. This might help a little with the build, but the size of our app comes more from dependencies than the code itself. Also whenever I added the dynamic import to the code it would make recompile time while developing (edit a file and save) take about 20s. This was unbearable to work with.

Unfortunately this is a private repo so I can’t post the code.

[janakaud]

If you’re running into this when using npm run build or similar commands, invoking the Node script directly with a memory limit parameter might help:

node --max-old-space-size=4000 scripts/build.js

Applying the parameter to npm run build itself doesn’t seem to work, since a new Node process gets launched and it doesn’t inherit the memory limit from the parent (and is probably not supposed to, as well 😃 ); tried on both Window and Mac OS X.

[bugzpodder]

@tgreen7 does this comment help? https://github.com/facebook/create-react-app/issues/4536#issuecomment-393647911