react-native: Importing Poly (babel-polyfill,core.js symbol,es6-symbol) Crashes app on load - Objects are not valid as React child
- I have reviewed the documentation
- I have searched existing issues
There might be something to learn from this issue even if it is not the same maybe its a similar loading issue? https://github.com/facebook/react-native/pull/15182
- I am using the latest React Native version
I tried to use Symbol in my local project but none of the poly’s I found work they all crash RN when I try to run even the simplest app with Objects are not valid as React child reconcileChIldFibers throws InvalidObjectType line 8348:31 (ReactNativeRenderer - dev.js)
Environment
Environment: OS: Linux 4.15 Node: 8.10.0 Yarn: 1.5.1 npm: 5.6.0 Watchman: Not Found Xcode: N/A Android Studio: Not Found
Packages: (wanted => installed) react: ^16.3.0-alpha.1 => 16.3.0-alpha.3 react-native: 0.54.2 => 0.54.2
Steps to Reproduce
react-native init rnsymboleish cd rnsymboleish npm install --save babel-polyfill (or npm install --save es6-symbol) npm install
—App.js
import 'babel-polyfill'; //---> or //'es6-symbol/implement' //'core-js/es6/symbol';
import React, { Component } from 'react';
import { Text, View} from 'react-native';
export default class App extends Component {
render() {
return (
<View>
<Text>
Eish
</Text>
</View>
);
}
}
react-native run-android
Expected Behavior
Thought it would not crash…?
Actual Behavior
3-24 19:14:45.728 30769 31013 I ReactNativeJS: Running application “rnsymbolwtf” with appParams: {“rootTag”:1}. DEV === true, development-level warning are ON, performance optimizations are OFF 03-24 19:14:45.748 30769 31013 E ReactNativeJS: Invariant Violation: Objects are not valid as a React child (found: object with keys {$$typeof, type, key, ref, props, _owner, _store}). If you meant to render a collection of children, use an array instead. 03-24 19:14:45.748 30769 31013 E ReactNativeJS: 03-24 19:14:45.748 30769 31013 E ReactNativeJS: This error is located at: 03-24 19:14:45.818 30769 31013 E ReactNativeJS: Invariant Violation: Objects are not valid as a React child (found: object with keys {$$typeof, type, key, ref, props, _owner, _store}). If you meant to render a collection of children, use an array instead. 03-24 19:14:45.818 30769 31013 E ReactNativeJS: 03-24 19:14:45.818 30769 31013 E ReactNativeJS: This error is located at:
About this issue
- Original URL
- State: closed
- Created 6 years ago
- Comments: 26 (7 by maintainers)
Moving
import 'core-js/es6/symbol';
to the top of index.js solved the problem for me.It seems like there are enough workarounds for this to consider the issue resolved.
I have the same issue since I migrated to RN 0.57.
Adding
import 'core-js'
in theindex.js
file of the project, at line 1, solved the error.Why adding this import is solving this error?
@ronhe, moving it to the top of the file did not work for me, unfortunately 😦