CODEWITHSUNDEEP
react-native
Daniel Masarin
Daniel Masarin

Reputation: 301

Upgrade to react-native 0.16 error

I upgraded my app from react-native 0.15 to 0.16 but after that I'm getting an error and I don't know how to solve it.

enter image description here

TypeError:undefined is not an object (evaluating 'GLOBAL.Text={
get defaultProps(){
throw getInvalidGlobalUseError('Text')}}')

In Chrome Debugger:

Uncaught Error: Uncaught TypeError: Cannot set property 'Text' of undefined

Thanks

OBS: I'm running on Android.

I notice that changing app name solves the problem, I'm using Evently as app name today. I tried to recreate my virtual machine but didn't solve it.

Upvotes: 10

Views: 1621

Answers (3)

Jason Child
Jason Child

Reputation: 1

In my case the problem was a rogue .babelrc two folders up (my root code folder); I had initiated a yeoman generator to scaffold out a new project using babel-6...accidentally running yeoman from the root code folder. Apparently babel traversed upwards from my project folders until it hit this .babelrc which borked the react-native babel configs...

^ this was originally an edit to my initial answer, which was deleted WHILE I WAS UPDATING IT

Upvotes: 0

IanVS
IanVS

Reputation: 3775

In my case, I was able to narrow the cause down to one item in my .babelrc file:

{
    "presets": ["es2015"]
}

As soon as I removed that and restarted the packager (making sure to also use the --reset-cache flag), I stopped getting the error.

Update 2: It looks like React Native is making some changes to their .babelrc in version 0.20.0. So, if you are using that version or newer, you should follow the instructions at: https://github.com/facebook/react-native/tree/master/babel-preset in order to specify your .babelrc settings.

Update: I've narrowed this down further to transform-es2015-modules-commonjs, which React-Native sets some options on, specifically {"strict": false, "allowTopLevelThis": true}. The es2015 preset does not set this option, and it seems that the React-Native .babelrc does not override it. If you want to use es6 modules and transform them to commonjs, you'll need to put the following in your .babelrc:

{
    "plugins": [
        ["transform-es2015-modules-commonjs", {"strict": false, "allowTopLevelThis": true}]
    ]
}

Note, Babel 6, which I updated to along with react-native 0.16.0, no longer contains any transforms by default. What I didn't initially realize is that the React-Native packager provides most of the transforms you might ever need (listed in their docs at: https://facebook.github.io/react-native/docs/javascript-environment.html#javascript-syntax-transformers), and I'm thinking that the "es2015" plugin interferes with some of those transformers.

I also tried using "babel-preset-react" (http://babeljs.io/docs/plugins/preset-react/), and that plugin did not seem to cause any errors.

Upvotes: 10

Daniel Masarin
Daniel Masarin

Reputation: 301

I solve the problem. I think it was because permissions in project folder. I ran chown in my folder to correct the permissions problems and now all are working.

Thanks

Upvotes: 0

Related Questions