React-native: [Metro Bundler] Maximum call stack size exceeded (when upgrading to 0.50.1)

Created on 6 Nov 2017  ·  43Comments  ·  Source: facebook/react-native

Is this a bug report?

Yes

Have you read the Contributing Guidelines?

Yes

Environment

Environment:
  OS: Linux 4.10
  Node: 8.9.0
  Yarn: 1.3.2
  npm: 5.5.1
  Watchman: 4.1.0
  Xcode: N/A
  Android Studio: Not Found

Packages: (wanted => installed)
  react: ^16.0.0 => 16.0.0
  react-native: ^0.50.1 => 0.50.1


Target Platform: iOS (10.3) & Android (targetSdkVersion 22)

Steps to Reproduce

Just upgraded from 0.49.5 to 0.50.1 and tried to bundle. The breaking changes in the new release hadn't affected my app and shouldn't have affected the build process.

  1. npm i [email protected]
  2. react-native bundle --verbose --platform android --dev false --entry-file index.js --bundle-output output.bundle

Output:

Scanning folders for symlinks in /home/james/Documents/react-native-app/node_modules (5ms)
Scanning folders for symlinks in /home/james/Documents/react-native-app/node_modules (7ms)
Loading dependency graph, done.

Maximum call stack size exceeded
[Error]  "react-native bundle" command exited with code 1.

On the other hand when I reinstalled react-native 0.49.5:

  1. npm install [email protected]
  2. react-native bundle --verbose --platform android --dev false --entry-file index.js --bundle-output output.bundle

Output:

Scanning folders for symlinks in /home/james/Documents/react-native-app/node_modules (5ms)
Scanning folders for symlinks in /home/james/Documents/react-native-app/node_modules (13ms)
Loading dependency graph, done.
bundle: start
bundle: finish
bundle: Writing bundle output to: output.bundle
bundle: Done writing bundle output
Assets destination folder is not set, skipping...

What does work

Running react-native start (i.e. developer mode) works fine

Expected Behavior

The project should bundle correctly

Actual Behavior

The bundling fails with a stack overflow. There's no clear indication what is causing the behavior because there's no stack trace despite explicitly enabling verbose mode. I don't know whether stack traces of these errors are kept but it may be helpful in identifying the problem.

I upgraded Node (from v6 to v8) because I thought that may be causing it.

Installed packages

├── [email protected]
├── [email protected]
├── UNMET PEER DEPENDENCY [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── UNMET PEER DEPENDENCY [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected] (git+https://github.com/jamsch/react-native-keyboard-aware-scrollview.git#5575b8c31df341c1719630fe2c7c08c171477243)
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
├── [email protected]
Stale
Source
picture jamsch
👍5 🎉1

Most helpful comment

but we are upgrading from RN 0.36

You are a brave man.

I confirm RN 0.50.3 fixed my issue, without need for bumping metro-bundler version in package.json resolutions.

picture fungilation on 8 Nov 2017
😄4 🎉1

All 43 comments

this is happening on android

sibelius picture sibelius on 6 Nov 2017
👍2

this is happening on node 6 and also node 8

with android and ios

with react-native 50 and also 50.1

sibelius picture sibelius on 6 Nov 2017

Also seeing this 😕

adbl picture adbl on 6 Nov 2017

Setting the --dev true makes the bundle suceed.

adbl picture adbl on 6 Nov 2017

@adbl can you share your deps?

JCMais picture JCMais on 6 Nov 2017

I took the time to uninstall pretty much every package in my large project until I was left with the following:

[email protected] /home/james/Documents/react-native-app
├── [email protected]
├── [email protected]
├── [email protected]

(I also poly-filled the missing imports)
The error still occurs with only these packages installed.

What's unusual is that I also tried a react-native init project and that bundled fine. Has this got something to do with the project size?

Anyways, I'll be sticking to 0.49.5 for the time being until I can find out why this is happening.

jamsch picture jamsch on 6 Nov 2017

I think that I may have found the problem. One of my unused recursive functions in the project seem to be causing the bundling error.

The unusual thing I found is that if the function was called it would bundle correctly. Otherwise there's a stack overflow. This only affects non-dev bundles.

function isFirstChild(parentNode, childNode) {
  if (!parentNode || !childNode || !parentNode.children || !parentNode.children.length === 0) return false;

  if (parentNode.children[0] === childNode) return true;

  return isFirstChild(parentNode.children[0], childNode);
}

Also changing the function to a const arrow function seems to work.

const isFirstChild = (parentNode, childNode) => {
  if (!parentNode || !childNode || !parentNode.children || !parentNode.children.length === 0) return false;

  if (parentNode.children[0] === childNode) return true;

  return isFirstChild(parentNode.children[0], childNode);
}

So my theory is that updates to the metro bundler cli between react-native 0.49.5 and 0.50.1 now cause stack overflows when bundling files that contain an unreferenced recursive function.

jamsch picture jamsch on 7 Nov 2017

@jamsch I have been struggling with this issue too now for quite some time. How were you able to point the problem to this little function?

Btw, it took me like two hours to figure out out that setting DEBUG=Metro:* in environment gave me debug logs when running bundler, should be mentioned in docs somewhere I think. But it doesn't give me any information in which function it crashes so not so helpful anyway.

adbl picture adbl on 7 Nov 2017

@adbl I started adding/removing module includes starting from the app root until I narrowed down a specific file.

Even though it bundles successfully, the app unfortunately now instantly crashes in production mode, while dev mode is still fine. I can't tell what's wrong because obviously the bundle is minified and I'm left with the error:

com.facebook.react.common.JavascriptException: undefined is not an object (evaulating 'e.length'), stack:
<unknown>@382.132
<unknown>@382:196
exports@382:395
...

I'll be sticking with 0.49.5 for now.

jamsch picture jamsch on 7 Nov 2017
👍1

Yeah, I'm about to give up for now too. I suspect it could be related to minification and saw this commit which could be related: https://github.com/facebook/metro-bundler/commit/367a5f5db805a9445e6f07ba9551d4fba259d1c7

adbl picture adbl on 7 Nov 2017

Ok, so in our case when I comment out everything from App.react.js it bundles, but when I add back imports for just @expo/ex-navigation it fails, so if fails something there.

adbl picture adbl on 7 Nov 2017

Yep, here is the code causing trouble in ex-navigation: src/ExNavigationRouter.js:

function _isSerializable(obj: Object): boolean {
  if (
    _.isUndefined(obj) ||
    _.isNull(obj) ||
    _.isBoolean(obj) ||
    _.isNumber(obj) ||
    _.isString(obj)
  ) {
    return true;
  }

  if (!_.isPlainObject(obj) && !_.isArray(obj)) {
    return false;
  }

  for (var key in obj) {
    if (!_isSerializable(obj[key])) {
      return false;
    }
  }

  return true;
}

Which is referenced conditionally only if __DEV__ which I guess transformed away per the commit I referenced in my previous comment.

And yes, the bundle doesn't fail if changing it to:

function _isSerializable = function(obj: Object): boolean {
...
adbl picture adbl on 7 Nov 2017
👍3

Going a bit deeper, I now have a minified production jsbundle which crashes inside what I think is minified regenerator-runtime:

ReferenceError: record is not defined
    at Generator._invoke (http://localhost:8081/index.bundle?platform=ios&dev=true&minify=true:67:931)

the crashing minified code is:

if(o=b,"normal"===(record=n(t,r,e)).type){o=e.done?j:E;var f={value:record.arg,done:e.done};

I think this is here: https://github.com/facebook/regenerator/blob/9b6ebc0532ff373e06e3421b26800ac8979913d3/packages/regenerator-runtime/runtime.js#L300

Shouln't more people have this problem, I thought async/await was used widely by now?

adbl picture adbl on 7 Nov 2017
👍1

I am also seeing issues when trying to get a production build with 0.50.1. I tried unmangling the minified bundle and traced where the error was coming from. One of the dependencies was pulling in https://github.com/Qix-/color-convert/blob/master/route.js and when the code went through the minification process, the models variable was undefined and the app crashed when trying to access the property of the undefined. Looks like there are some issues with how the js bundle is being minified for the production build. Maybe fixing metro-bundler to a previous release would work for now. Not sure.

nim23 picture nim23 on 7 Nov 2017

Trying previous versions of metro-bundler.
0.19.0 has the same problem.
0.18.0 fails to bundle, I'm guessing not compatible with RN 0.50.1.

I think this commit is causing all the trouble: https://github.com/facebook/metro-bundler/commit/ad927b93dc1295af0091c60c852dc0c674ac9b28#diff-126ae02fbbc88cd17236fb9fc425c6e5 upgrading to uglify-es. Here is an uglify bug which coule be the one causing the bundling issues described initially: https://github.com/mishoo/UglifyJS2/issues/2442

Let me know if there is anything else I can to, we are depending on v0.50.1 to fix iPhone X support in our app (SafeAreaView).

adbl picture adbl on 7 Nov 2017

Wohoo, I hacked yarn.lock to make metro-bundler use [email protected] and the minified bundle doesn't crash.

adbl picture adbl on 7 Nov 2017

@adbl great work, could you share you small fix?

sibelius picture sibelius on 7 Nov 2017

@sibelius so in yarn.lock, should say:

uglify-es@^3.1.0:
  version "3.1.8"
  resolved "https://registry.yarnpkg.com/uglify-es/-/uglify-es-3.1.8.tgz#2f21a56871d6354dcc21469cc034c3967f14c5b1"
  dependencies:
    commander "~2.11.0"
    source-map "~0.6.1"

rather than 3.1.7, but I also installed uglify-es manually first and messed around in node_modules to actually make it so. I think if you change this in yarn.lock and yarn remove react-native && yarn add react-native should do the trick?

adbl picture adbl on 7 Nov 2017

@adbl you could also use yarns resolutions in your package json

"resolutions": {
        "uglify-es": "3.1.8"
}

I did that after seeing your comment that the problem was uglify-es

aparedes picture aparedes on 7 Nov 2017
👍3

I believe the fix has landed in Metro Bundler with version 0.20.1. Can you try using it with https://yarnpkg.com/lang/en/docs/selective-version-resolutions/ system?

Let me know if it fixes the problem and will release fixed 0.50 version right away.

grabbou picture grabbou on 7 Nov 2017

Can someone else affected please do this? I can test it tomorrow morning
CET earliest.
On Tue, 7 Nov 2017 at 19:23, Mike Grabowski notifications@github.com
wrote:

I believe the fix has landed in Metro Bundler with version 0.20.1. Can you
try using it with
https://yarnpkg.com/lang/en/docs/selective-version-resolutions/ system?

Let me know if it fixes the problem and will release fixed 0.50 version
right away.

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
https://github.com/facebook/react-native/issues/16689#issuecomment-342574850,
or mute the thread
https://github.com/notifications/unsubscribe-auth/AAK22BM5WTM3DQCEKjdclfe3Q4qTlyJUks5s0KAtgaJpZM4QSowl
.

adbl picture adbl on 7 Nov 2017

Awesome that the issue is identified and fixed so quickly. I spent hours trying to troubleshoot this and it was driving me insane. :+1:

petejkim picture petejkim on 7 Nov 2017

Nevermind.... Spoke too soon, still getting:

2017-11-07 11:37:55.556 [error][tid:com.facebook.react.JavaScript] undefined is not an object (evaluating 'e.length')
2017-11-07 11:37:55.557765-0800 Cipher[67684:6161103] undefined is not an object (evaluating 'e.length')
2017-11-07 11:37:55.559 [fatal][tid:com.facebook.react.ExceptionsManagerQueue] Unhandled JS Exception: undefined is not an object (evaluating 'e.length')
2017-11-07 11:37:55.559538-0800 Cipher[67684:6161092] Unhandled JS Exception: undefined is not an object (evaluating 'e.length')

@jamsch Were you able to fix this issue?

petejkim picture petejkim on 7 Nov 2017
👍3

@petejkim Unfortunately not. Even with adding the module resolution I'm having the same error as you are.

jamsch picture jamsch on 7 Nov 2017

The minified js bundle is working fine for me now.

nim23 picture nim23 on 7 Nov 2017

Seems to use the correct version of uglify-es

├─┬ UNMET PEER DEPENDENCY [email protected]
│ ├─┬ [email protected]
│ │ ├── [email protected] deduped
│ │ ├── [email protected]
│ │ ├── [email protected] deduped
│ │ ├── [email protected] deduped
│ │ ├── [email protected]
│ │ ├── [email protected]
│ │ ├── [email protected] deduped
│ │ ├── [email protected] deduped
│ │ ├── [email protected] deduped
│ │ ├── [email protected] deduped
│ │ ├── [email protected] deduped
│ │ ├── [email protected] deduped
│ │ ├── [email protected] deduped
│ │ ├── [email protected] deduped
│ │ ├── [email protected] deduped
│ │ ├── [email protected] deduped
│ │ ├── [email protected] deduped
│ │ ├── [email protected]
│ │ ├── [email protected]
│ │ ├── [email protected]
│ │ ├── [email protected] deduped
│ │ ├── [email protected]
│ │ ├── [email protected]
│ │ ├── [email protected] deduped
│ │ ├── [email protected]
│ │ ├── [email protected]
│ │ ├── [email protected] deduped
│ │ ├── [email protected]
│ │ ├── [email protected] deduped
│ │ ├── [email protected] deduped
│ │ ├── [email protected]
│ │ ├── [email protected]
│ │ ├── [email protected]
│ │ ├── [email protected] deduped
│ │ ├── [email protected]
│ │ └── [email protected]
jamsch picture jamsch on 7 Nov 2017

Can everyone who said the fix doesn't work make sure it's been applied
correctly? I have mixed feedback which is not helpful! So far we doing
great job.

I am going to be back to sleep now, but expect me to be online around 10
Central European Time.

On Tue, 7 Nov 2017, 9:55 pm jamsch, notifications@github.com wrote:

Seems to use the correct version of uglify-es

├─┬ UNMET PEER DEPENDENCY [email protected]
│ ├─┬ [email protected]
│ │ ├── [email protected] deduped
│ │ ├── [email protected]
│ │ ├── [email protected] deduped
│ │ ├── [email protected] deduped
│ │ ├── [email protected]
│ │ ├── [email protected]
│ │ ├── [email protected] deduped
│ │ ├── [email protected] deduped
│ │ ├── [email protected] deduped
│ │ ├── [email protected] deduped
│ │ ├── [email protected] deduped
│ │ ├── [email protected] deduped
│ │ ├── [email protected] deduped
│ │ ├── [email protected] deduped
│ │ ├── [email protected] deduped
│ │ ├── [email protected] deduped
│ │ ├── [email protected] deduped
│ │ ├── [email protected]
│ │ ├── [email protected]
│ │ ├── [email protected]
│ │ ├── [email protected] deduped
│ │ ├── [email protected]
│ │ ├── [email protected]
│ │ ├── [email protected] deduped
│ │ ├── [email protected]
│ │ ├── [email protected]
│ │ ├── [email protected] deduped
│ │ ├── [email protected]
│ │ ├── [email protected] deduped
│ │ ├── [email protected] deduped
│ │ ├── [email protected]
│ │ ├── [email protected]
│ │ ├── [email protected]
│ │ ├── [email protected] deduped
│ │ ├── [email protected]
│ │ └── [email protected]

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
https://github.com/facebook/react-native/issues/16689#issuecomment-342618895,
or mute the thread
https://github.com/notifications/unsubscribe-auth/ACWcxsqNCjqCIm6QD2ADJnznzVi6xHveks5s0MPVgaJpZM4QSowl
.

grabbou picture grabbou on 7 Nov 2017
🎉1

Yes those are applied correctly. (checked yarn.lock) It appears that the modules are not being loaded in correct order as well? (Polyfills for functions like setTimeout and requestAnimationFrame also appear to be missing when the app bundle is being loaded in release mode. try putting setTimeout(() => {}, 1); in the first line of your index.js.

petejkim picture petejkim on 7 Nov 2017
👍1

Confirmed fix in using resolving Metro Bundler with version 0.20.1 in package.json, with my issue in CodePush: https://github.com/Microsoft/react-native-code-push/issues/1072#issuecomment-342646542

fungilation picture fungilation on 7 Nov 2017

I think there are multiple issues here. I did not have the Maximum call stack size exceeded (when upgrading to 0.50.1) issue, but I have the crash at runtime only in Release mode issue.

petejkim picture petejkim on 8 Nov 2017
👍1

@petejkim that is true in my case too. Haven't seen Maximum call stack size exceeded (runtime or bundle time), only runtime error in CodePush and caught by Sentry.

fungilation picture fungilation on 8 Nov 2017

@petejkim It seems like the other issue that you are experiencing is https://github.com/facebook/metro-bundler/issues/78 . This was fixed by 1a2a46a9fb3e3af2089c06ce7a25dbcd8737201b but we haven't released a major version of metro with that fix yet (I'm planning to release v0.21.0 tomorrow).

@petejkim as a workaround, can you try to add a require('InititializeCore'); statement as early as possible on your application logic?

rafeca picture rafeca on 8 Nov 2017

I confirm that with resolutions using metro bundler 0.20.1 in our project solves:

Our app seems to be working fine but we are upgrading from RN 0.36 so we have a lot of QA to do.

adbl picture adbl on 8 Nov 2017

0.50.3 is on CI now and should be on npm soon.

On Wed, 8 Nov 2017 at 10:47 Andreas Amsenius notifications@github.com
wrote:

I confirm that with resolutions using metro bundler 0.20.1 in our project
solves:

Our app seems to be working fine but we are upgrading from RN 0.36 so we
have a lot of QA to do.

—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub
https://github.com/facebook/react-native/issues/16689#issuecomment-342764639,
or mute the thread
https://github.com/notifications/unsubscribe-auth/ACWcxid-5Qo2AB6oMwclfmv6agLys98Aks5s0Xi4gaJpZM4QSowl
.

grabbou picture grabbou on 8 Nov 2017
🎉3

but we are upgrading from RN 0.36

You are a brave man.

I confirm RN 0.50.3 fixed my issue, without need for bumping metro-bundler version in package.json resolutions.

fungilation picture fungilation on 8 Nov 2017
😄4 🎉1

The issue with e.length is related to https://github.com/facebook/react-native/issues/16745

christopherdro picture christopherdro on 8 Nov 2017

50.3 still crashes iOS apps that are in release mode. When can we expect a fix for this? @grabbou

ItsNoHax picture ItsNoHax on 9 Nov 2017

The fix has shipped. Can you check if the crash is related to this issue?
Is there any way for you to get the stack trace?

On Thu, 9 Nov 2017 at 12:26 Alberto Blanco notifications@github.com wrote:

50.3 still crashes iOS apps that are in release mode. When can we expect a
fix for this? @grabbou https://github.com/grabbou

—
You are receiving this because you were mentioned.

Reply to this email directly, view it on GitHub
https://github.com/facebook/react-native/issues/16689#issuecomment-343126310,
or mute the thread
https://github.com/notifications/unsubscribe-auth/ACWcxnVONcu1y1ZZo8hNmjfoRX0uj5D9ks5s0uFvgaJpZM4QSowl
.

grabbou picture grabbou on 9 Nov 2017

@ItsNoHax are you sure you're not seeing this issue instead: #16745 ?

askielboe picture askielboe on 9 Nov 2017

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Maybe the issue has been fixed in a recent release, or perhaps it is not affecting a lot of people. If you think this issue should definitely remain open, please let us know why. Thank you for your contributions.

stale[bot] picture stale[bot] on 8 Jan 2018

I get this error when I try to import a node module in react native (I know we cant import node modules in react-native, but there's a way doing it), I've raised an issue, please clarify https://github.com/philikon/ReactNativify/issues/14

TheCapedBaldi picture TheCapedBaldi on 25 Jan 2018

I'm on react-native 0.52.2 and facing this issue. The crash happens only in Android Release build. I suspect iOS Release build will have this issue too, but haven't tried to build an iOS release app yet.

02-05 17:05:40.017 6096-6137/? E/AndroidRuntime: FATAL EXCEPTION: mqt_native_modules
                                                 Process: com.appname, PID: 6096
                                                 com.facebook.react.common.JavascriptException: Maximum call stack size exceeded., stack:
                                                 <unknown>@11:410
                                                 <unknown>@11:410
                                                 <unknown>@11:410
jasdeepsingh picture jasdeepsingh on 5 Feb 2018

react-native 0.52.3. Same issue.

  • happens only on Android
  • only on --variant=release
04-24 16:37:45.957 31436 31484 E ReactNativeJS: Maximum call stack size exceeded.
04-24 16:37:46.192 31436 31484 E ReactNativeJS: Module AppRegistry is not a registered callable module (calling runApplication)
04-24 16:37:47.708 31436 31485 E AndroidRuntime: FATAL EXCEPTION: mqt_native_modules
04-24 16:37:47.708 31436 31485 E AndroidRuntime: Process: com.package.name, PID: 31436
04-24 16:37:47.708 31436 31485 E AndroidRuntime: com.facebook.react.common.JavascriptException: Maximum call stack size exceeded., stack:
04-24 16:37:47.708 31436 31485 E AndroidRuntime: <unknown>@11:410
04-24 16:37:47.708 31436 31485 E AndroidRuntime: <unknown>@11:410
04-24 16:37:47.708 31436 31485 E AndroidRuntime: <unknown>@11:410
04-24 16:37:47.708 31436 31485 E AndroidRuntime: <unknown>@11:410
suvodeep-pyne picture suvodeep-pyne on 24 Apr 2018
Was this page helpful?
0 / 5 - 0 ratings

Related issues

grabbou picture grabbou  ·  3Comments
madwed picture madwed  ·  3Comments
despairblue picture despairblue  ·  3Comments
DreySkee picture DreySkee  ·  3Comments
anchetaWern picture anchetaWern  ·  3Comments