I want to create a new react-native project using this command in the terminal of visual studio :
npx react-native init project-name
But the terminal freezes for 10 minutes in this line
⸨⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⠂⸩ ⠇ rollbackFailedOptional: verb npm-session e582ffa365b35dcf
Screenshot
I've tried these solutions but none of them worked for me.
When I tried npx create-react-app teachat, it worked very well. I got confused if the problem is related to npm or react-native.
For these reasons it could occure.
1.network connectivity: some times your internet connection is okay but some applications may interfere when downloading dependency. In this case, try using a different network.
Try removing react-native-cli from global installation with this npm uninstall -g react-native-cli
3.Try different version or typescript template
npx react-native init projectname --version X.XX.X or npx react-native init AwesomeTSProject --template react-native-template-typescript
The react native cli is a deprecated method of creating react native projects,the init method is the one currently in use. Check under Creating a new application the official docs
Uninstall react-native-cli and use the same command as you did npx react-native init projectname
I have a question regarding the package manager npm and the meaning of installing the package globally.
For example I work often with react, should I install react globally?
npm install -g react react-dom
Does this mean that next time when I do
npx creat-react-app my-app
It will get the package from the global or it does not matter and it will still download it locally inside my-app?
Because I really do not understand the idea behind installing globally.
Because if I want to use a package it should be mentioned in package.json, if it is in package.json it is then located in node_module ... so yeah ...
Could anyone give me better insight?
Thanks in advance
React library can be installed globally on your local machine. In development there is no real reason to do that since you might not have the latest version and this might cause issues.
Better practise is to use react on project level by using the command you stated above npx create-react-app my-app
If you push code to a server the package.json file will install the dependencies (React, React DOM,..) to build your project.
Read more here : https://create-react-app.dev/docs/getting-started/
If you've previously installed create-react-app globally via npm
install -g create-react-app, we recommend you uninstall the package
using npm uninstall -g create-react-app or yarn global remove
create-react-app to ensure that npx always uses the latest version.
You can check what packages are installed globally using:
npm list -g --depth 0
Previously, when I had tried using react-native we were told to use react-native run-ios to run the project from the command line. Now, the instructions say to use npx react-native run-ios from the command line.
What in the benefit of using npx. Does using npx change how the project is compiled? If I sometimes use npx and sometimes neglect to use it will it mess anything up in my project?
Check this answer more about of npx
react-native supported and recommended to use npx start from react-native#0.60.0.
The benefit of using npx is don't need to install react-native-cli tools globally. Check the below example of using npx and not for the react-native project.
### Using npx ###
﹩ npx react-native init <SimpleProjectName>
### Without using npx ###
﹩ npm i -g react-native-cli
﹩ react-native init <SimpleProjectName>
Both react-native-cli and npx react-native are should not use in one project. The official docs said before starting a new project:
If you previously installed a global react-native-cli package, please remove it as it may cause unexpected issues.
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
I have two different ReactNative-Projects:
a) a project from januar 2016
b) a complete new react-native project
from now (march 20th 2016)
Within the new project the cli tool of react-native contains the command "run-ios" next two "run-android", but not on the older project from januar 2016. On the older one there is not "run-ios" command available:
$ react-native run-ios
Command `run-ios` unrecognized
Usage: react-native <command>
I already ran "react-native upgrade" without any issues.
How can i get the command "run-ios" also in older projects?
Just update the version of react native in your project with the following command:
$> npm install --save react-native#latest
What caused this for me was running npm install --save [package] when actually the system has previously been using yarn instead of npm.
To solve this I just deleted the node_modules folder and ran: yarn install and after that react-native run-ios (or android) works fine.
$ react-native run-ios
If you get this kinda error:
"Command run-ios unrecognized. Make sure that you have run npm
install and that you are inside a react-native project".
In terminal, make sure you are inside a react-native project directory.
Execute this cmd:
$ react-native -v
react-native-cli: 2.0.1
react-native: n/a - not inside a React Native project directory
$ npm update
$ react-native -v
react-native-cli: 2.0.1
react-native: 0.44.0
$ react-native run-ios
This may sound silly, but make sure you cd to your project directory. If that fails then perform the npm install in the other answers.
I found a solution that works for me.
Update the version of react native in your project:
npm install --save react-native#latest
then upgrade your npm version
npm i npm#latest -g
then move directory folder 1 level up, type
cd ..
make a new react-native installation folder
react-native init NewProject
then go to your project folder(NewProject), after that
react-native run-ios
should work fine.
This happens when the project has an older version of react native. You can update the react version or for people who do not want to upgrade, just open the .xcodeproj file in iOS dir and hit the play button in the Xcode.
In my case, it was an issue with the package.json file. I deleted a section during a test. I recover a previous file with the deleted section and everything was working again.
this works for me
sudo npm install -g react-native-cli --force
then
react-native run-ios
In my case, I am using monorepo with multiple packages in a single repo. I solved this error by
Deleting the packages/myapp/node_modules
running yarn install from the project root. Not inside packages
its solved. Now can run yarn ios or yarn android commands
Note:
For autolinking libraries you need to have all of your dependencies in root package.json file also copied to packages/myapp/package.json file. See https://github.com/react-native-community/cli/blob/master/docs/autolinking.md#how-can-i-use-autolinking-in-a-monorepo
Example:
"dependencies": {
"#react-native-community/datetimepicker": "^3.5.2",
"#react-native-community/masked-view": "^0.1.11",
"#react-navigation/native": "^5.9.4",
"#react-navigation/stack": "^5.14.5",
"#reduxjs/toolkit": "^1.6.0",
"#voximplant/react-native-foreground-service": "^2.0.0",
"axios": "^0.21.1",
"babel-eslint": "^10.0.3",
"eslint-config-airbnb": "^18.0.1",
"eslint-plugin-import": "^2.18.2",
...
...
but make sure NOT TO COPY
"react-native-cli": "^any version",
otherwise react-native-cli would collide and you will continue to see error like
Command `run-android` unrecognized. Make sure that you have run `npm install` and that you are inside a react-native project.
error Command failed with exit code 1.
or
Command `run-ios` unrecognized. Make sure that you have run `npm install` and that you are inside a react-native project.
error Command failed with exit code 1.
I created a brand new react-native project using
$ react-native init projectName
and ran from root of the project
$ react-native run-ios
Everything worked fine and iOS simulator fired up as expected.
Than I installed prop-types node module using npm install prop-types --save. Re-ran $ react-native run-ios and ran into this error Command run-ios unrecognized
Solution:
From the root of my project, removed node_module and re-installed modules using npm. Commands below
$ rm -rf node_modules/
$ npm install
$ react-native run-ios
For me, Xcode was already running.
Close the Xcode and then in the terminal, make sure you are inside a react-native project directory and then execute react-native run-ios command
For me, the only thing that worked was to checkout again my repository from zero and run:
npm install -g react-native-cli yarn
yarn
git submodule update --init --recursive
What caused this for me was running npm install --save axios when actually the system was previously using yarn instead of npm.
To solve this, instead of deleting the node_modules folder, which can lead to more problems, and if you prefer to run npm anyway or don't have a preference either way, the error should have instructed for you to run npm install. If you literally follow those instructions, you will be able to run: react-native run-ios afterwards.
I also fell in this error and the reason was
I was using yarn link command in wrong folder
Delete the node-modules. Its because the packages are not installed.
rm -rf node_modules
npm install
then run your project
react-native run-ios