'JavaScript heap out of memory' when adding a dependency on the SDK to a small react-native app

[vizyviz]

Adding a dependency on the aws-sdk-js to a small react-native app causes react-native bundler to crash with 'JavaScript heap out of memory':

Added this line (per the README.MD) to my app.js (no other code changed):

var AWS = require('aws-sdk/dist/aws-sdk-react-native');

Results in the following when launching my app:
┌────────────────────────────────────────────────────────────────────────────┐
│ Running Metro Bundler on port 8081. │
│ │
│ Keep Metro Bundler running while developing on any JS projects. Feel │
│ free to close this tab and run your own Metro Bundler instance if you │
│ prefer. │
│ │
│ https://github.com/facebook/react-native │
│ │
└────────────────────────────────────────────────────────────────────────────┘
Looking for JS files in
D:\Proj

Metro Bundler ready.

Loading dependency graph, done.
transform[stderr]: FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory
transform[stderr]: FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory
transform[stderr]: FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory
Bundling index.js [development, non-minified] 99.6% (556/557), failed.
error: bundling failed: Error: Uncaught error in the transformer worker: D:\Proj\node_modules\metro-bundler\src\transformer.js
at _transform.then.catch.error (D:\Proj\node_modules\metro-bundler\src\JSTransformer\index.js:191:31)
at process._tickCallback (internal/process/next_tick.js:109:7)

[AllanZhengYP]

Hi @NON-STANDARD
I don't think this issue is related to our SDK. I find some other people also meet this problem, some of them solve this problem by setting a larger node memory size, maybe you can refer to these issues.
I will just close this issue. But feel free to reopen it if you have found a reproducible config or code that has something to do with aws-sdk.

[ghost]

same problem here. Added that line of code and can't build for release on Android anymore

[ghost]

@NON-STANDARD and @AllanFly120, we were able to solve this issue. Although the symptom was a memory issue, that does not seem to be the actual root cause. It appears that the AWS file we are importing is already transpiled and can be left out when doing the babel transformation. This can be achieved by adding the following to the package.json of our react native project:

"babel": {
"ignore": ["node_modules/aws-sdk/dist/aws-sdk-react-native.js"]
},

Without the above, it seems that the packager goes into a loop and no matter how much memory you give node, it's never enough. We got a hint that this could be the issue looking at this post. There are other ways to ignore said file, including adding the above code to the package.json of the aws-sdk itself. @AllanFly120 feel free to address it the way you deem more appropriate. At a minimum it'd be great if a note could be added to the readme for those that use the aws-sdk in a react-native project.

[LuongTruong]

Hi @eR1011 , I have the same issue like you. When I see your code, I feel like my life is saved. However, I add your code to my package.json in react native app but it is not working. It looks like the babel do not ignore is. Do you have any way to ignore a file in babel.

Here is my package.json:

{
  "babel": {
    "ignore": [
      "node_modules/aws-sdk/dist/aws-sdk-react-native.js"
    ]
  },
  "name": "IncreaseHeapSize",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest"
  },
  "dependencies": {
    "aws-sdk": "2.369.0",
    "react": "16.6.0-alpha.8af6728",
    "react-native": "0.57.4"
  },
  "devDependencies": {
    "babel-jest": "23.6.0",
    "jest": "23.6.0",
    "metro-react-native-babel-preset": "0.50.0",
    "react-test-renderer": "16.6.0-alpha.8af6728"
  },
  "jest": {
    "preset": "react-native"
  }
}

I try this but fail too:

npx babel node_modules --out-dir lib --ignore "node_modules/aws-sdk/dist/aws-sdk-react-native.js"

If you have any suggestion, please let me know. I am willing to hear from you

[LuongTruong]

Hi everyone , I am able to run debug by changing the package.json to:

"scripts": {
    ...
  "start-max": "node --max-old-space-size=8192 node_modules/react-native/local-cli/cli.js start",
    ...
},

In terminal run: "npm run start-max" to start the node server with 8,192 MB.
Then run your project as normal: "react-native run-android".

Enjoy!

[Blutude]

I am able to run my simulator when running that "start-max" script, but when I try to upload my app to testflight, I keep getting the out of memory error. --max-old-space-size=8192 does not help.
I put the babel "ignore" command on both my app's package.json and the aws-sdk package.json but that does not help. Did anyone of you figure it out?

[LuongTruong]

Hi @Blutude , run "start-max" is only for debug mode. If you want to release, we have to config more. I write a post on Medium about it. Hope it can help you.

React native max-old-space-size

Sorry for replying you late

[Blutude]

I had actually seen that post and did try that. But the Xcode build still fails with JavaScript heap out of memory.
I can't use this package because of this. Instead I am using react-native-aws3 which works well, but it does not implement deleteObject (I can't delete files from s3), which I could do with aws-sdk

[LuongTruong]

Hi @Blutude , I guess it is because of the version. I fix the issue with:

1/ React native: "0.57.4"
2/ Xcode version: "10.1"

Can you please let me know your version?

[LuongTruong]

hey @Blutude , how is everything?

[Blutude]

Hi @truongluong1314520, sorry for the late reply. I still have errors. My Xcode version is 10.1, React native is 0.58.6.

In build phases --> Bundle React Native code and images when I replace node by 'node  --max_old_space_size=8192', it gives me the following error: "Can't find 'node --max_old_space_size=8192' binary to build React Native bundle"

Instead, I try it without the quotes and archive the project but I get "FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory".

[LuongTruong]

Hi @Blutude , you can try this one:

export NODE_ARGS="--max-old-space-size=8192"
export NODE_BINARY="node"
../node_modules/react-native/scripts/react-native-xcode.sh

Maybe my previous solution is out of date 😞

[mikeRChambers610]

I have been dealing with this issue for about 20 hours after reading about one hundred different posts. Seeing so many suggestions without examples or any guidance on where to insert scripts (cli / package.json / babel folders / node_module). PLEASE BE MORE SPECIFIC. :)))......>=//

For my specific issue, I am received the following heap allocation error for a react-native project created via expo-cli which includes aws packages.

package.json:
{
"main": "node_modules/expo/AppEntry.js",
"scripts": {
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
"web": "expo start --web",
"eject": "expo eject"
},
"dependencies": {
"aws-amplify": "^1.1.29",
"aws-appsync": "^1.8.1",
"aws-appsync-react": "^1.2.9",
"expo": "^33.0.0",
"graphql-tag": "^2.10.1",
"immutability-helper": "^3.0.1",
"react": "16.8.3",
"react-apollo": "^2.5.6",
"react-dom": "^16.8.6",
"react-native": "https://github.com/expo/react-native/archive/sdk-33.0.0.tar.gz",
"react-native-aws3": "0.0.9",
"react-native-elements": "^1.1.0",
"react-native-image-pan-zoom": "^2.1.11",
"react-native-keyboard-spacer": "^0.4.1",
"react-native-search-box": "0.0.19",
"react-native-web": "^0.11.4",
"react-navigation": "^3.11.0",
"react-redux": "^7.1.0",
"source-map-explorer": "^2.0.0"
},
"babel": {
"ignore": ["./node_modules/aws-sdk/dist/aws-sdk-react-native.js"]
},
"devDependencies": {
"babel-preset-expo": "^5.1.1"
},
"private": true
}

app.json

"expo": {
"name": "testapp",
"slug": "AwesomeProject",
"privacy": "public",
"sdkVersion": "33.0.0",
"platforms": [
"ios",
"android",
"web"
],
"version": "1.0.0",
"orientation": "portrait",
"icon": "./assets/icon.png",
"splash": {
"image": "./assets/splash.png",
"resizeMode": "contain",
"backgroundColor": "#ffffff"
},
"updates": {
"fallbackToCacheTimeout": 0
},
"assetBundlePatterns": [
"**/*"
],
"ios": {
"supportsTablet": true
}
}
}

Error:
Press ? to show a list of all available commands.
transform[stdout]:
transform[stdout]: <--- Last few GCs --->
transform[stdout]:
transform[stdout]: [19564:0x104000000] 60198 ms: Mark-sweep 1334.1 (1455.9) -> 1330.6 (1455.9) MB, 2604.0 / 0.0 ms (average mu = 0.079, current mu = 0.009) allocation failure scavenge might not succeed
transform[stdout]: [19564:0x104000000] 62917 ms: Mark-sweep 1334.4 (1455.9) -> 1333.4 (1455.9) MB, 2714.1 / 0.0 ms (average mu = 0.040, current mu = 0.002) allocation failure scavenge might not succeed
transform[stdout]:
transform[stdout]:
transform[stdout]: <--- JS stacktrace --->
transform[stdout]:
transform[stdout]: ==== JS stack trace =========================================
transform[stdout]:
transform[stdout]: 0: ExitFrame [pc: 0x29a78035be3d]
transform[stdout]: 1: StubFrame [pc: 0x29a7803134b0]
transform[stdout]: Security context: 0x3b5d3619e6e9
transform[stdout]: 2: visitQueue [0x3b5d13404849] [/Users/mikechambers/exponavs/AwesomeProject/node_modules/@babel/traverse/lib/context.js:~96] [pc=0x29a780763282](this=0x3b5dbc815389 ,queue=0x3b5dbc8153e9 <JSArray[1]>)
transform[stdout]: 3: /* anonymous / [0x3b5d33e5e939] [/Users/mikechambers/exponavs/AwesomeP...
transform[stdout]:
transform[stderr]: FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory
transform[stderr]: 1: 0x10003cf99 node::Abort() [/usr/local/bin/node]
transform[stderr]: 2: 0x10003d1a3 node::OnFatalError(char const, char const*) [/usr/local/bin/node]
transform[stderr]: 3: 0x1001b7835 v8::internal::V8::FatalProcessOutOfMemory(v8::internal::Isolate*, char const*, bool) [/usr/local/bin/node]
transform[stderr]: 4: 0x100585682 v8::internal::Heap::FatalProcessOutOfMemory(char const*) [/usr/local/bin/node]
transform[stderr]: 5: 0x100588155 v8::internal::Heap::CheckIneffectiveMarkCompact(unsigned long, double) [/usr/local/bin/node]
transform[stderr]: 6: 0x100583fff v8::internal::Heap::PerformGarbageCollection(v8::internal::GarbageCollector, v8::GCCallbackFlags) [/usr/local/bin/node]
transform[stderr]: 7: 0x1005821d4 v8::internal::Heap::CollectGarbage(v8::internal::AllocationSpace, v8::internal::GarbageCollectionReason, v8::GCCallbackFlags) [/usr/local/bin/node]
transform[stderr]: 8: 0x10058ea6c v8::internal::Heap::AllocateRawWithLigthRetry(int, v8::internal::AllocationSpace, v8::internal::AllocationAlignment) [/usr/local/bin/node]
transform[stderr]: 9: 0x10058eaef v8::internal::Heap::AllocateRawWithRetryOrFail(int, v8::internal::AllocationSpace, v8::internal::AllocationAlignment) [/usr/local/bin/node]
transform[stderr]: 10: 0x10055e434 v8::internal::Factory::NewFillerObject(int, bool, v8::internal::AllocationSpace) [/usr/local/bin/node]
transform[stderr]: 11: 0x1007e6714 v8::internal::Runtime_AllocateInNewSpace(int, v8::internal::Object**, v8::internal::Isolate*) [/usr/local/bin/node]
transform[stderr]: 12: 0x29a78035be3d
transform[stderr]: 13: 0x29a7803134b0
transform[stderr]: 14: 0x29a780763282
Building JavaScript bundle [===============================================] 99

[iampeterbanjo]

I'm trying to use this SDK in a create-react-app but the build fails with an out of memory error (see below). The root cause is because I want to authenticate my app I'm using an Amazon profile. The API to perform an Amazon profile authentication is SharedIniFileCredentials which is ONLY available on the root AWS class imported by import AWS from 'aws-sdk. I would rather import only the SDK I need e.g. import AWS from 'aws-sdk/clients/ses'; but that's not possible because the API design means I won't have access to SharedIniFileCredentials method.

Could you please consider extending the API of the client classes so that they can be used without a dependency on the root class?

Security context: 0x35f19bba5891 <JSObject>
                      2: /* anonymous */(aka /* anonymous */) [/**/node_modules/webpack-sources/lib/applySourceMap.js:42] [bytecode=0x7f04049bd41 offset=26](this=0x27362d482201 <null>,mapping=0x2b6cdef70909 <Object map = 0x145050ebe741>)
                      3: arguments adaptor frame: 3->1
                      4: forEach(this=0x2377a1802249 <JSArray[211317]>)
                      5: eachMapping(aka SourceMapConsumer_eachMapping) [/dat...
                  
                  FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory

[lock]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs and link to relevant comments in this thread.