React-native-router-flux: Objects are not valid as a React child

Created on 28 Jan 2017 · 9Comments · Source: aksonov/react-native-router-flux

Version

react-native-router-flux v3.37.0
react-native v0.40.0
(windows 10)

When Debug JS remotely is disabled the app shows this message and cannot start:

If it is enabled, everything is OK. Why?

Source

afilp

Most helpful comment

We found something new.

We changed
import 'babel-polyfill';

TO:
require('babel-polyfill');

and now it works!

I wonder why (and why the problem was only on Android, not iOS).

The above statement is the 1st one on Main.js component, even above the React and React Native imports (as the instructions say).

afilp on 20 Feb 2017

👍3 ❤1

All 9 comments

@aksonov Any idea how this could be fixed? Thanks a lot!

afilp on 31 Jan 2017

I don't know how to reproduce it. Sorry, I'm using Mac and iOS only.

aksonov on 31 Jan 2017

@afilp I've gotten the same problem with 0.39 however I am not using react-native-router-flux. Please let me know if you found a solution.

edmundito on 2 Feb 2017

@edmundito This is interesting, I believe that one of our dependencies cause this but Ι do not know which one. In my case, if I remove the react-native-router-flux logic and just render a plain View, it works.

This is why I suspected react-native-router-flux (which may use a dependency that you also have and causes this problem).

Can you please let us know if you also use Windows?

agnaf on 13 Feb 2017

I also see that the problem is caused with "Enable Hot Reloading". When this is ON, the problem occurs unless the Debug JS remotely is also ON. If both are OFF, it seems to be working.

afilp on 13 Feb 2017

❤1

Major problem: This also happens on the Release version, so the app crashes immediately after it starts.

See Report bug here:

I hope we can find a solution to this... If someone has any idea or a link to a different issue (on a different package maybe?) please let us know. Thanks!

afilp on 13 Feb 2017

We found something new.

We changed
import 'babel-polyfill';

TO:
require('babel-polyfill');

and now it works!

I wonder why (and why the problem was only on Android, not iOS).

The above statement is the 1st one on Main.js component, even above the React and React Native imports (as the instructions say).

afilp on 20 Feb 2017

👍3 ❤1

@afilp Where did you change that? I am having a very similar issue (RN 0.41, windows 10, Android), and it only happens when Hot Reloading is on. Wasn't happening to me before my upgrade from RN 0.35.

I searched the react-native module folder and didn't find any mention of babel-polyfill except in the package.json.

Then I searched all of my projects src folder and didn't find any mention of babel-polyfill, as well.

suark on 24 Mar 2017

I had similar problem but on iPad only. I tested same build on desktop and on Android, but the error occurred only on iPad. Thanks to @afilp, I checked my webpack config and found that some of dependencies are absent from vendor build. I added them and the problem disappeared.

Note that I'm using react (not native).