Strange react-native Version Number When Running from Local `node_modules` - react-native

When I run react-native --version from the global installation, it reports to me what I consider to be an accurate version number, like this:
react-native-cli: 2.0.1
react-native: 0.61.4
However, when I run yarn react-native --version (from the local installation at node_modules, it reports the version number simply as 3.2.1.
Can anyone explain why?

EDIT: The definitive way to find the react native version number for your local project is to run react-native info locally. This can be done one of the following ways:
npm run react-native info
yarn react-native info
In answer to the original question: "Why am I seeing the strange version number?", here is my analysis:
As it turns out, I did not have react-native installed globally. I had react-native-cli installed globally.
If you open Terminal and cd to some random directory and run react-native --version (assuming you also have react-native-cli installed), the response will look something like this:
$ react-native --version
react-native-cli: 2.0.1
react-native: n/a - not inside a React Native project directory
If you then cd to a react-native project's root folder and run react-native --version, it will return the actual version number of that local project.
However, when you run yarn react-native --version from the root folder of a react-native project, what actually gets returned is the version of the #react-native-community/cli installation. (You get the same result if you run npx react-native --version or if you look in the package.json file of the local #react-native-community/cli installation in node_modules/#react-native-community/cli.
So, long story short, if you want to know the exact react-native version your local project is using, use react-native info (easy) or open up ./node_modules/react-native/package.json and it will tell you the version number.

Related

Cannot run program "npx": error=2, No such file or directory when running React Native app

I have been working with react-native project in another pc and it has been working correctly. Now I cloned project to another device where I have react-native installed since I work with other project and I cannot run it.
When I run react-native run-android I get this error:
Cannot run program "npx": error=2, No such file or directory
I'm using Android Studio 4 on Mac OS Catalina 10.15.6.
I solved the problem by running Android Studio with bellow command on console.
$ open -a "Android Studio.app"
Simple steps you need to go through to make it work with npx
sudo npm uninstall -g react-native-cli
sudo npm i -g npx
npx react-native run-android
More detailed explanation why this is happenig
Issue was that Facebook is not using anymore react-native-cli as they are using npx.
As stated in Facebook page:
If you previously installed a global react-native-cli package, please remove it as it may cause unexpected issues.
So i had to run sudo npm uninstall -g react-native-cli to remove react-native-cli
They also say that npx is shipped with nodejs but that wasn't my case.
React Native has a built-in command line interface, which you can use to generate a new project. You can access it without installing anything globally using npx, which ships with Node.js.
So I had to install it using sudo npm i -g npx
After installing npx then just need to run npx react-native run-android.
Be aware of npx before react-native run-android
Now you don't have any command react-native now we only have 'npx' and react-native run-android is just a parameter for npx. For ex. to start metro we should run npx react-native start
I had the same issues, so I followed these steps:
Start by installing the latest version of Android Studio (Don't delete the old version, just copy paste that to another directory or in my case I just added the Android Studio 3.2.1 that I had to a folder called olderAndroidStudio, on mac).
Make sure you don't click on import settings from Existing.
Follow along the installation, and complete it.
Build and Run, app runs without any problems.
I additionally uninstalled react-native-cli using the method given in the accepted answer.
In my case, I just quit Android Studio and reopened, and the error was gone.
Maybe throw in a ./gradlew clean for goo measure.
I solved it by finding the command that was throwing error and ran it directly
node -e "console.log(require('react-native/cli').bin)"
which outputs a path, something like
$HOME/my-app/node_modules/#react-native-community/cli/build/bin.js
then I pasted that path in android/app/build.gradle
project.ext.react = [
entryFile: "index.js",
enableHermes: true, // clean and rebuild if changing
cliPath: "$HOME/my-app/node_modules/#react-native-community/cli/build/bin.js" // <--- add this
]

why do I get react-native command not found error on windows pc?

I am very new to React-native and I have a sample project when I tried running the command react-native run-android. I got an error command not found.
in the current directory do
react-native -v
you will get the following
react-native -v
react-native-cli: version
react-native: version
if it shows command not found the n you have not installed react native in the directory. Do a npm init in new folder and try installing a new react native project there
by doing npm install -g react-native-cli
Follow the steps to add path variable react-native.
You're good to go.
Have you run 'npm install' (without parameters) in the project directory? That'll install the dependencies for your project.
Details here: https://docs.npmjs.com/cli/v6/commands/npm-install
1.Try to install globally npm install -g react-native-cli 2.add path of npm module (C:\Users\your user name\AppData\Roaming\npm) to system variables instead of user variables

How to downgrade react-native from 0.56.0 to 0.55.4 version?

Actually I am using react-native-camera in my app but it is not working in this version (react-native: 0.56.0) & its working in this version(react-native: 0.55.4).
So now I want to downgrade the react-native: 0.56.0 to react-native: 0.55.4.
My System configuration:
npm 6.1.0,
react-native-cli: 2.0.1,
react-native: 0.56.0,
Mac OS, Xcode 9.3
Thank you
So open the file of your project named as package.json
Inside it you can find react-native": "0.56.4" replace this version with react-native": "0.55.4" or whatever the version you want
Then save the file
Go to the terminal or power sell
Rich to your project directory and run the command npm install
After installation check the version of react-native by running the command react-native --version and make sure that version is which you changed in package.json
Restart your project and you are ready to go
Open the file of your project named as package.json
Inside it you will find react-native": "0.56.0" replace this version with react-native": "0.55.4" or the version which you want to change and save the file
go to the terminal or power sell
Go to your project directory and run command npm install
after installation check the version of react-native by running the command react-native -v and check that the version which you changed in package.json is same as the version you get here, then restart your project.

React Native version check

I wanted to check the version of the react native I was using in my project when I used the command from my root folder :
D:\Reactnative\Albums>npm view react-native version
0.56.0
The version was 0.56.0 which is not the version I have installed, but on:
D:\Reactnative\Albums>react-native -v
react-native-cli: 2.0.1
react-native: 0.55.4
The version mentioned here is 0.55.4, which is correct.
So why this conflict?
npm view react-native version
You can check the latest version of react native. You can run it under the root of your project or everywhere. Of course, you will need internet connection to check latest version.
react-native -v
If you run under the root of project, it will return the version of two npm packages, react-native-cli and react-native. Those versions are using in your project.
Just wanted to clarify Aung's answer:
npm view react-native version checks globally while react-native -v ran inside project's root folder checks version of the app itself.
Macbook M1 Chip
npm view react-native version

Setup a cloned react-native project created via react-native init command

I have created a react-native project XYZApp using react-native init which is pushed in GitHub repo.
Now when I am cloning the project on a different system. following is the directory structure
app/XYZApp
Following is the set of commands and steps I am using.
cd app
brew install node
brew install watchman
#
npm install -g react-native-cli
#
install android studio and required SDKs
#
install X-Code
#
react-native init MyApp
prompt: Directory MyApp already exists. Continue?: (no)
I am typing - yes
npm install [all dependencies]
react-native link
Through all the above steps, some new default files are getting created which runs a default app, with some minor changes in those files I am able to run the app. But I know this is not the correct way of doing this.
I tried several other methods also,
like npm start
I checked several links but could not find the correct method for the setup after cloning.
Most of them are mentioned for create-react-native-app method.
It will be great if someone can help me regarding this.
after cloning
Don't do this
react-native init MyApp
prompt: Directory MyApp already exists. Continue?: (no)
I am typing - yes
npm install [all dependencies]
react-native link
just go to cloned app directory XYZApp and do
npm install
and all set to run the app using
react-native run-android
Update 2019 React Native 0.60.0+:
First you need to install all the node modules by running
npm install
If you're using libraries with native dependencies like react-native-gesture-handler these libraries need to be linked correctly. To do so run
react-native link
For setting up the iOS project correctly you need to install the CocoaPods dependencies:
cd ios && pod install