react-native-cli is not compatible with npm@5

[johndanek]

Is this a bug report?

Yes

Have you read the Bugs section of the Contributing to React Native Guide?

Yes

Environment

1. react-native -v:

react-native-cli: 2.0.1
react-native: 0.45.1

1. node -v:

v8.1.1

1. npm -v:

5.0.4

1. yarn --version (if you use Yarn):
   0.23.2

Then, specify:

1. Target Platform (e.g. iOS, Android): Whatever the result of yarn start is
2. Development Operating System (e.g. macOS Sierra, Windows 10): macOS Sierra
3. Build tools (Xcode or Android Studio version, iOS or Android SDK version, if relevant): Not relevant

Steps to Reproduce

Perform the first four steps outlined in the Getting Started (https://facebook.github.io/react-native/docs/getting-started.html) guide with a totally fresh React Native project.

1. npm install -g create-react-native-app
2. create-react-native-app AwesomeProject
3. cd AwesomeProject
4. npm start

Expected Behavior

I thought a dev server would run, or I would see the QR code mentioned in the Getting Started guide. I would expect react-native to be compatible with npm 5.0.4 or give instructions as to how to downgrade (not ideal). I wouldn't expect it to just outright break.

Actual Behavior

➜  /Users/foo/TestApp npm start

> [email protected] start /Users/foo/TestApp
> react-native-scripts start

1:54:47 PM: Starting packager...
***ERROR STARTING PACKAGER***

Error: You are using npm version 5.0.4. Please use an npm version that is >= 3.0.0 and < 5.0.0.
1:54:47 PM: Error starting packager: Error: Couldn't start project. Please fix the errors and restart the project.
    at /xdl/src/Project.js:1038:11
    at Generator.next (<anonymous>)
    at step (/Users/foo/TestApp/node_modules/xdl/build/Project.js:1468:191)
    at /Users/foo/TestApp/node_modules/xdl/build/Project.js:1468:361
    at <anonymous>
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] start: `react-native-scripts start`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/foo/.npm/_logs/2017-06-28T20_54_47_593Z-debug.log

Reproducible Demo

Explained above.

[hramos]

This appears to be an issue with npm 5, as the error states. You can try downgrading to npm 4.

[gi4nks]

+1

[floriancargoet]

You can downgrade npm with: npm install -g npm@4

[ankitpopli1891]

Quoting @johndanek again,

I would expect react-native to be compatible with npm 5.0.4 or give instructions as to how to downgrade (not ideal)

We understand that react-native or react-native-cli might not be responsible for the bug, but as the naive users, we do expect it to work gracefully.

It'd be great if someone can explain the issue, rather than just telling us to downgrade. It would not only help us understand the issue, but we might be able to contribute as well. Even if can't, we'll be able to raise the issue in the right repository.

[otoinsa]

And there I thought that there is a new way of setting up a React Native project that is less painful; Turns out create-react-native-app will not work out of the box with the latest software and suggests using yarn (which does not work in parity with npm for git based dependencies)...

And now if you try to start a new project using the old way (react-native init) it will out right brake as well. See this: https://github.com/facebook/react-native/issues/14843

So really, right now there is no way to develop apps on React Native, unless you already have an older project started; that will probably have the upgrade issues of it own as so many of us have experienced.

You got us hooked, now please make this work as expected for once! :D

[hramos]

@ankitpopli1891 I would start by removing the npm version check, and running the test suites and resolving any issues that may pop up. I'm sure the community would appreciate a PR that removes any issues with npm@5.

[mattop1709]

downgrade to npm version 4. Works for me!

[ide]

A newer version of npm@5 may work as well. Try using npm 5.1.0 for example.

[ankitpopli1891]

@hramos happy to give it a go, will do it this weekend :smiley:
@ide thanks for the update, will try it out. Thanks :+1:

[leoafarias]

I got the same error with npm 5.1.0 had to downgrade

[essaji]

I just installed yarn & everything worked like a charm brew install yarn

[iosdev-republicofapps]

@hramos any idea when this might be fixed? I'm just starting out with react-native but can't get it to even create an app due to this bug. I really appreciate react native being free and I want to use it! :-) But this feels like a showstopper and npm doesn't seem to be working on a fix nor does react native ... Any ideas? This is really impacting a lot of people. I'd be happy to help - any suggestions? Thanks!

[iosdev-republicofapps]

I have react native running with npm 4.6.1, but as newcomer to both node and react native, it makes me a bit nervous to have to depend on a version of npm that's many versions behind the current stable version of npm. But it is working ... Let me know if I can help! :-) BTW, thanks for all you do making react native available for free - not meaning to be a whiner, just frustrated, that's all. React native is actually pretty awesome, nice work!

[ide]

If you're using create-react-native-app, there's at least one known bug with npm 5 (https://github.com/npm/npm/issues/16893) that prevents it from working and there isn't an obvious and simple workaround. Probably the best way to move forward is to submit a PR to npm.

[agrcrobles]

It is working fine for me following the steps above using [email protected] but still getting this warning:

You are using npm version 5.4.2. There may be bugs in this version, use it at your own risk. We recommend version 4.6.1.

[munirulhakim]

Downgrade to npm 4 with this commad npm install -g npm@4

[alvinometric]

Hi,
Do we know if the new minor versions of npm fixed this ?
According to this it looks like it might ?

[Zhuinden]

npm i -g npm@4

[ivanfilhoz]

If you cannot downgrade npm for some reason, install yarn.

[danielheddelin]

This appears to still be an issue? 8½ months later, new users still cannot follow the recommended getting started guidelines? Perhaps you should just rewrite the instructions a bit if the solution is 1-year-away?

[iarna]

npm should handle yarn generated trees gracefully as of [email protected] and as such, this should no longer be an issue.

[ivanfilhoz]

React Native is the only reason I still have yarn installed.

EDIT: Uninstalled already. As of [email protected], everything is working fine.

[danielheddelin]

Sorry but I'm not following. I am using [email protected] and getting

>

---

ERROR: npm 5 is not supported yet

---

It looks like you're using npm 5 which was recently released.

Create React Native App doesn't work with npm 5 yet, unfortunately. We
recommend using npm 4 or yarn until some bugs are resolved.

You can follow the known issues with npm 5 at:
https://github.com/npm/npm/issues/16991

---

[ivanfilhoz]

You can use yarn to create your project, then you just delete node_modules and run npm install.

After that, you are ready to go with npm start.

[AtomStar]

I upgraded to npm 5.7.1 but still get the following after create-react-native-app, Step 4 (npm start) :

    npm ERR! missing script: start

npm ERR! A complete log of this run can be found in:
npm ERR!     /...-debug.log

[danielheddelin]

I do understand that I can use yarn. But if that's mandatory then perhaps the getting started directions should not instruct to use npm - which doesn't work.

[ivanfilhoz]

Actually, npm works fine, but there is a hardcoded lock for [email protected]. That lock can be safely updated to accept [email protected] or greater now. Or at least it seems like it does.

[AtomStar]

@ivanslf what do I need to remove the lock? Would prefer not having to downgrade to npm 4.6.1

[danielheddelin]

Doesn't change the fact that new users cannot trust the getting started guide..

[ivanfilhoz]

@AtomStar

You can use yarn to create your project, then you just delete node_modules and run npm install.

After that, you are ready to go with npm start.

[jeffvandyke]

Last night, I was able to use create-react-native-app with yarn installed, and npm start worked without problems. I did have to update my global react-native package, though. I would double-check npm outdated -g if there are still issues. (Linux, Manjaro, npm 5.7.1)

[timlorepublic]

npm 5.8.0 has no issue as well

[avinashwigroup]

@putrantoinc : Can you please tell me how did you install the 5.8.0 version?

[mikkotikkanen]

@avinashwigroup npm install npm -g