React-native: Hot Reloading `Maximum call stack size exceeded` error with circular reference

Created on 29 Apr 2016  路  24Comments  路  Source: facebook/react-native

Say, there are two files a.js and b.js.

a.js:

require('./b');

b.js:

require('./a')

After change one of this file, with Hot Reloading enabled, it will run into an infinite situation and cause Maximum call stack size exceeded finally.

Even if I use a dynamic require in a function, such as what in b.js:

function f(){
  require('./a')
}
Locked

Most helpful comment

This issue is still happening as of 0.48.0. This should be opened again

All 24 comments

Also having this issue

cc @martinbigio

Im having same issue! running react-native 0.29.2, it will only give the Maximum call stack size exceeded if "Remote JS debugging" is enabled. But without Remote JS debugging it will still import the modules 1000 of times making HOT extremely slow.

https://www.dropbox.com/s/qcwa3g3v5a5azi6/Screenshot%202016-07-20%2016.16.49.png?dl=0

Did anyone manage to solve this one, I'm having a hard time with this..

Adding module.hot.accept(() => { }); to one of the files in the circular reference fixes the error but excludes that file from hot reloading.

You could also try using JavaScript-style import and export instead of Node-style require. Might work, it's a lot more resilient to cycles.

@respectTheCode Thanks, for now it does the job

@ide I'm using import and export, thanks anyway for the answer

had anyone solve 'Im having same issue! running react-native 0.29.2, it will only give the Maximum call stack size exceeded if "Remote JS debugging" is enabled. But without Remote JS debugging it will still import the modules 1000 of times making HOT extremely slow.' problem??

+1 Dealing with this problem forever.

As soon as I've created the project from CLI with _init_ option, without even touch anything on the generated code, enabling JS debugging remotely cause this same _maximum call stack size exceeded_ issue. Running through Android Emulator.

react-native-cli: 1.3.0
react-native: 0.39.1

same problem on "react-native": "0.38.0" and "react": "15.4.1" for iOS as soon as I try to Debug JS Remotely for debugging with Nucleotide code: https://github.com/Laybium/laybium/tree/issue-107

For anyone have this problem, the workaround for me was using Xcode to deploy a simulator and not using react-native run-ios. When I use the cli, I get this error but when I used Xcode, I don't. Have no idea why the fuck it works that way but it does.

+1, on Android

+1, on Android

Hi there! This issue is being closed because it has been inactive for a while. Maybe the issue has been fixed in a recent release, or perhaps it is not affecting a lot of people. Either way, we're automatically closing issues after a period of inactivity. Please do not take it personally!

If you think this issue should definitely remain open, please let us know. The following information is helpful when it comes to determining if the issue should be re-opened:

  • Does the issue still reproduce on the latest release candidate? Post a comment with the version you tested.
  • If so, is there any information missing from the bug report? Post a comment with all the information required by the issue template.
  • Is there a pull request that addresses this issue? Post a comment with the PR number so we can follow up.

If you would like to work on a patch to fix the issue, contributions are very welcome! Read through the contribution guide, and feel free to hop into #react-native if you need help planning your contribution.

This issue is still happening as of 0.48.0. This should be opened again

+1

same issue

I recommend opening a new issue and filling out the template (as recommended by the message above).

Can't believe this is still not addressed!!!!

Hey folks! This has been recently fixed and it will be available in v0.54.0

I'm running 0.54.4 and am still encountering this error. Here's the code that triggers the bug (I've logged out all values and the data structure is exactly what I want it to be... anything that strikes y'all as wrong syntactically?):

let onSlotPressesExist = false
if(slots.length == 2 && !!slots[1].length ) {
  slots = slots[1].map(slot => {
    if(!!slot.onPress) onSlotPressesExist = true
    return {
      ...slot,
      onPress : () => {
        if(!!slots[0].onPress) slots[0].onPress()
        if(!!slot.onPress) slot.onPress()
      },
      style : {
        ...slots[0].style,
        ...slot.style
      }
    }
  })
} else if(!!slots.length) {
  slots = slots.forEach(slot => {
    if(!!slot.onPress) onSlotPressesExist = true
  })
} else {
  console.warn('error with slots config')
}

@harrysolovay can you provide more information? do you have a circular dependency? Are you getting any error message in the device/console?

Was this page helpful?
0 / 5 - 0 ratings