React-native: Failed to load bundle: Cannot read property 'throwIfClosureRequired' of undefined

Created on 20 Apr 2018  路  63Comments  路  Source: facebook/react-native

Environment

Environment:
OS: macOS High Sierra 10.13.4
Node: 9.5.0
Yarn: 1.5.1
npm: 5.8.0
Watchman: 4.9.0
Xcode: Xcode 9.3 Build version 9E145
Android Studio: Not Found

Packages: (wanted => installed)
react: 16.3.1 => 16.3.1
react-native: 0.55.3 => 0.55.3

Steps to Reproduce

react-native init RNApp
# ...
react-native run-ios

or by opening RNApp.xcodeproj and hitting "run"

Expected Behavior

App launches normally on simulator

Actual Behavior

screen shot 2018-04-20 at 19 41 25

Locked 馃摝Bundler

Most helpful comment

@andrewcpeltier,

Open your package.json and change the devDependencies to:

  "devDependencies": {
    ...
    "babel-preset-react-native": "4.0.0",
    ...
  },

Then run npm install.

All 63 comments

This is throwing in my tests when upgrading to babel-preset-react-native to 5.0.0

Does not happen on 4.x of preset with 0.55.3 of react-native installed

Same here

same issue, happened just now

Same issue happened in windows for run-android

downgraded babel-preset-react-native to 4.0.0 and worked

downgraded babel-preset-react-native to 4.0.0 and worked. same as the comments above.

First time I tried to play with react-native and I was greeted by the same bug too. So unfortunate for a first experience!! I can however confirm that downgrading babel-preset-react-native to 4.0.0 worked for me as well.

How do you downgrade bable-preset-react-native to 4.0.0?

@andrewcpeltier I just ran into this issue as well. Just edit the version number in your package.json file and npm install.

Edit: Worked for me as well by the way!

Also confirming this. Seemed to happen as of today when running 'react-native init' and then running a new project in XCode. Downgrading babel-preset to 4.0 or below seems to work.

@andrewcpeltier,

Open your package.json and change the devDependencies to:

  "devDependencies": {
    ...
    "babel-preset-react-native": "4.0.0",
    ...
  },

Then run npm install.

The babel-preset-react-native package was just published 6 hours ago, so somewhere in the RN dependency tree, it's pulling the latest version instead of a fixed one.

Yeah looks like this started happening right after the publish. But that worked! Thanks a bunch for the help @achuvm and @Sapulidi !

I can confirm changing to "babel-preset-react-native": "4.0.0" also worked for me +1

What's funny is this wasn't changed that long ago: https://github.com/facebook/react-native/commit/34bd776af2f2529009188fced91083203a48fd40

Odd how that came right through to everyone's CLI. Seems to me it should be tied to the specific RN version, not github?

@GantMan

The issue are due to these lines in the react-native init script (copied below):

https://github.com/facebook/react-native/blob/57919a3edd3d09f595224e0d92f95da1df75e884/local-cli/init/init.js#L88-L97

You can see that the jestDeps are jest babel-jest babel-preset-react-native react-test-renderer@${reactVersion}, but only the react-test-renderer is given a version. Which means every time anyone runs the react-native init script, it'll install the latest jest, babel-jest and babel-preset-react-native versions from npm as devDependencies.

The change you see shouldn't actually affect why we see this bug, but rather, it's the fact that version 5.0.0 of babel-preset-react-native was made the latest release about 9 hours ago: https://www.npmjs.com/package/babel-preset-react-native

That also explains why this bug was created 8 hours ago.

Change "babel-preset-react-native": "^4.0.0" and it work for me

I'm still get the same red error screen if I set the dev dependency to "babel-preset-react-native": "4.0.0". Anybody else running into the same issue?

Nvm, now it works. Weird. Thanks everyone! 馃槃

some here, i changed to 4 but error still

This issue is caused by the fact babel-preset-react-native depends on [email protected].

This version had an issue on babel-plugin-transform-block-scoping, as at this stage babel-helper-plugin-utils had not yet been created, and this one (created on v7.0.0-beta.41) is used to set a default {} for the options when they are not present (see here), that's the case for babel-plugin-transform-block-scoping declared here.

The only alternative would be to use yarn resolutions and lock all the babel depedencies to latest, but sadly this doesn't work either, as metro-bundler is in the middle of the migration to babel 7 and they are still using babel-core (core package from babel version 6), so when you run the packager, everything breaks.

So based on all this, I believe that the most sane alternative is to wait for babel-preset-react-native and metro-bundler to update their babel dependencies to latest and meanwhile keep using v4.0.0.

@duro Downgraded babel-preset-react-native to 4.0.0 and worked! Thank you!

If not work try this solution.
i) delete node_module folder.
ii) Open your package.json and change the devDependencies to:

"devDependencies": {
...
"babel-preset-react-native": "4.0.0",
...
},
Then run npm install.
It's worked for me.

drowgrading to "babel-preset-react-native": "4.0.0" didn't work for me :(

I changed to 4 but error still.

For those who have updated the "babel-preset-react-native" to version "4.0.0", and still seeing the issue:

  1. Run npm install again, before running the app with react-native run-android or react-native run-ios
  2. If you still see the issue, clear 'node_modules' directory, run rm -rf node_modules/ from your project directory and repeat step 1.

Worked for me with the environment:

  • OS: Ubuntu 17.04 64-bit
  • Project dependancies (package.json):

```
"dependencies": {
"react": "16.3.1",
"react-native": "0.55.3"
},
"devDependencies": {
"babel-jest": "22.4.3",
"babel-preset-react-native": "4.0.0",
"jest": "22.4.3",
"react-test-renderer": "16.3.1"
}

Owl7 Did you run "npm install" yet ?

@lehoangnam97 of course

@pritam-patil error still. 馃槩

@pritam-patil @lehoangnam97 Started work, I restarted the computer. 馃槃

@Owl7 looks like cache issue, I was having the same problem

after restarting my pc and then downgrading to "babel-preset-react-native": "4.0.0", solved the problem. Thanks @Owl7

Can you give me specific instructions?
Step 1: Run cmd
Step 2: react-native init app-name
Then how to fix the error.
thanks

open package.json

and replace this code "babel-preset-react-native": "5.0.0"

with "babel-preset-react-native": "4.0.0",

and then run npm install

thanks @husnaintahir ,
It already works

WARN [email protected] requires a peer of eslint@^3.17.0 || ^ 4.0.0 but none is installed. You must install dependencies yourself peer.
This error installs any package. thank you

Guys don't forget to remove yarn.lock or package-lock.json, before you do yarn install (npm install), otherwise the change of the version won't help ;)

downgrading to "babel-preset-react-native": "4.0.0" works!! Thanks to damiandizeo.
just change version of above dependency to 4.0.0 in package.json and run npm install, it will work.

Just confirmed, downgrading babel to "babel-preset-react-native": "4.0.0" in the project's package.json works. Thanks @damiandizeo

react-native run-ios command fails because of this issue on a fresh react native installation.

if you run into trouble after changing "babel-preset-react-native": "4.0.0" ... run in your terminal:

watchman watch-del-all && rm -rf $TMPDIR/react-* && rm -rf node_modules/ && npm cache clean && npm install && npm start -- --reset-cache

"devDependencies": {
"babel-jest": "22.4.3",
"babel-preset-react-native": "4.0.0",
"jest": "22.4.3",
"react-test-renderer": "16.3.1"
},
Thanks

Yes, removing yarn.lock and node_modules/ and changing babel-preset-react-native in package.json got the basic app to run.

Hi everyone,
To fix problem I did following steps:
1) remove node_modules folder : rm -rf node_modules/ and package-lock.json file
2) change "babel-preset-react-native": "4.0.0"
3) run npm install
4) restart OS. Aftering restart 'cd' to app folder and react-native run-ios.

Hope it will help.

Open your package.json and change the devDependencies to:

"devDependencies": {
...
"babel-preset-react-native": "4.0.0",
...
},
Then run npm install.

Thanks @achuvm, this worked...

same issue, happened just now after upgrading to version 5

@abhijitnukalapati - yes I am able to run the app after changing babel-preset-react-native to "4.0.0"
Try to change package.json and then re-install node modules
rm -rf node_modules && npm i

Open your package.json and change the devDependencies to:

"devDependencies": {
...
"babel-preset-react-native": "4.0.0",
...
},
Then run npm install.
Don't forgot to start yarn once again - yarn start
Thanks @turnipdabeets, it's working.

I am very sorry sorry, but how is this do?

This is throwing in my tests when upgrading to babel-preset-react-native to 5.0.0
Does not happen on 4.x of preset with 0.55.3 of react-native installed

It also helps to kill Metro bundler and restart your Simulator. I even deleted the app from my iOS simulator as well just in case there was code cached somewhere else.

After changing change change "babel-preset-react-native": "5.0.0" To "babel-preset-react-native": "4.0.0"

and run npm install. its works for me

Thanks so much

"babel-preset-react-native": "4.0.0"
it works, thanks!!!

@marksturm Thanks for the command. That worked for me finally.
Only one thing if you are using npm version > 5 then use this
watchman watch-del-all && rm -rf $TMPDIR/react-* && rm -rf node_modules/ && npm cache clean --force && npm install && npm start -- --reset-cache

Thanks... It works..
"babel-preset-react-native": "4.0.0"

@marksturm you just saved my life! <3
thanks a lot man, that was very helpful.

u guys saved me, thank you so much

Using "babel-preset-react-native": "4.0.0" works for me. Thank you!

What's the root cause?

The same problem, i solved dowgrading "babel-preset-react-native": "4.0.0" and restanting my computer, i'm on Ubuntu 17.10

Will get this fixed in next minor release today.

The legend says that one day you will be able to generate a react-native project without solving random errors.

@chuwuwang I am going to delete your comment and report this activity to Github. We do not accept such behavior that is way below the accepted standards. If React Native pisses you off, just don't use it. It's free world.

downgrade babbel and run npm install is not helping ... I had to restart computer to make it work

(closing as inactive, there have been new issues on the bundler subject and since this issue many things changed)

(if necessary open a new issue)

Was this page helpful?
0 / 5 - 0 ratings