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
react-native init RNApp
# ...
react-native run-ios
or by opening RNApp.xcodeproj and hitting "run"
App launches normally on simulator
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):
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:
npm install
again, before running the app with react-native run-android
or react-native run-ios
rm -rf node_modules/
from your project directory and repeat step 1. Worked for me with the environment:
```
"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)
Most helpful comment
@andrewcpeltier,
Open your
package.json
and change thedevDependencies
to:Then run
npm install
.