So I'm opening my the existing React Native project. This is the procedure on how I opened my existing React Native project. 1st step, type the location of my project which is in the "D:\rnprojects\firstproject\". 2nd step, "react-native-start". 3rd step, I opened another cmd then locate it again into my project directory then typed "npm start".
Why when I created this project I didn't get this error just when runnning/opening my existing project.
This the error that I got: (with versions)
There is only simple steps can solve your particular scenario issue quickly.
1) Install the React native cli in your project or globally.
npm install -g react-native-cli
OR
npm install react-native --save
then start your project by using this command
npm start
If any dependencies issue please follow the second solution
2) Please make sure you're installed all dependence
yarn install
OR
npm install
under your project directory
I'm pretty sure your issue will fix by using 1st solution Thanks.
it is simple:
1.npm install
2.react-native run-android
Here I guess you have the RN environment to run already on your side.
cd path_to_project
install packages(there are two following ways to install packages).
2.1 yarn install
2.2 npm install
react-native link(optional - you need to run this command if existing project use RN packages which need to link such as
react-native-vector-icons)
optional(if project use pods) cd ios pod install
react-native run-ios or react-native run-android according to the platform which you want to run on.
I don't think above is perfect instruction give you how to run the existing react-native project, But I am pleasure if give me some hints or help to you.
You can find official guide here
Sometimes npm's cache gets confused and need to reset it by using below command:
npm cache clean --force
Also try below command:
npm install --save-dev react-native-cli
Hope it will help you.
Related
I am using react native and Expo. I am unable to build new app because after I use expo init appName it shows the following error.
Heres the full message:
📦 Using npm to install packages. You can pass --yarn to use Yarn instead.
√ Downloaded and extracted project files.
× Something when wrong installing JavaScript dependencies. Check your npm logs. Continuing to initialize the app.
✅ Your project is ready!
To run your project, navigate to the directory and run one of the following npm commands.
- cd Scanner
- npm start # you can open iOS, Android, or web from here, or run them directly with the commands below.
- npm run android
- npm run ios # requires an iOS device or macOS for access to an iOS simulator
- npm run web
I tried multiple times to create a blank project, also tried npm install to install failed/not downloaded libraries and continue after failure but it showed another error:
npm ERR! code Z_BUF_ERROR
npm ERR! errno -5
npm ERR! zlib: unexpected end of file
also tried npm cache verify that showed cache is ok Content verified: 3562 (252580364 bytes).
So, How can I solve this issue?
Problems related to npm installation are very common If you do any mistake in early installation, but is avoided. Learn more about npm tree.
Steps worked for me are :
npm cache clean --force
npm cache verify
npm -g uninstall expo-cli --save
npm install expo-cli --global
expo init app-name
cd app-name
npm start
Always run as administrator if working on Windows and in root directory.
The solutions above didn't work for me but if you use 'npm install' in the directory of the app you get a clue that you shuold try 'npm install --force'
err message
You should have all these files folders and files at the start of the project otherwise not all the dependencies have been installed which is why we were getting the problem.folder structure
After you have added --force to npm install you have all the dependencies installed. Now you can run the app with npm start.
Unfortunately, all the solutions described above didn't work on my machine...
Here is my latest solution for this problem...
This worked 100% on my machine...
Use npm i -g expo-cli
This will automatically add the required packages and also remove the unnecessary ones.
Yes, surely, you don't need to uninstall and re-install it again.
Just follow my steps.
And, you can create your expo project using expo init.
I hope my solution will help you out from this annoying problem....
I just did npm install and it worked for me, but I had do that every time I create a new expo project.
I also encountered this problem, and finally found that it was the problem of react native cli，I installed the latest version of react native cli，Expo is back to normal
This Error is regarding to the git account. expos need a git account to setup react native project
If you are using windows you need to install git in your local PC
after that open your Terminal and type this command
git config --global user.name "your_username"
git config --global user.email "your_email_address#example.com"
after that clone any github project to your local computer. it will ask to login to Github
after all these steps try expo init <projectname>
The simple way to settle that error is by using "expo-cli init app-name" instead of "expo init app-name".
I tried and worked perfectly for me. Hope it will help you guys.
i have faced a similar problem and running yarn set version 1.22.1 fix it
Run the Command Prompt as an administrator. And run the following command:
npx create-expo-app AwesomeProject
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
]
I'm new to reactnative. I have followed steps to install reactnative properly but, while creating a new project, I'm getting an error. I'm using Windows 7 64 bit with i3 processor.
c:\ReactNativeProjects>react-native init AwesomeProject
Command npm install --save --save-exact react-native failed.
My Folder contains only one file
Since you are starting to use React Native, consider using Expo, I've used it and it makes developing, debugging, testing and deploying to the apple store and google play easier.
According to the official docs:
Expo is the easiest way to start building a new React Native
application. It allows you to start a project without installing or
configuring any tools to build native code - no Xcode or Android
Studio installation required (see Caveats).
Assuming that you have Node installed, you can use npm to install the
Expo CLI command line utility:
npm install -g expo-cli
Then run the following commands to create a
new React Native project called "AwesomeProject":
expo init AwesomeProject
cd AwesomeProject
npm start
This will start a development server for
you.
I've answered a question in SO for the steps and what happens when you build your .apk and .ipa files using Expo, have a look at that as well.
These are my steps to get rid of this error:
Please upgrade your npm
npm install -g npm#latest
Run npm cache clean command in Command prompt ( With some element of doubt for cache presence)
3.Ran react-native init in command prompt as Administrator (on Windows OS), hoping works well with sudo react-native init on Mac OS
If still problem persist make sure that you have followed each and every step mentioned in Documentation i.e. installed JDK, PYTHON, NODE.
Refer to this link For windows
I recently started with react-native. I install it using the tutorial on the Facebook site and everything works well for a day or two until this message comes up:
'react-native' is not recognized as an internal or external command,
operable program or batch file.
Nothing works except uninstalling everything and starting all over again. The environments are ok and work (npm, choco, etc.). I have also tried removing and adding react-native to environment variables, restarting, and running cmd in administrator mode, but nothing so far. I should add that I use windows 10 64-bit.
I had the same issue and tried the following but didnt work
Adding npm path to my Environment variables; both system and user
Re install npm and react-native-cli
Both didn't work for me, im using Windows 10;
Solution that worked for me is to install react-native-cli globally
You can install it globally by using the below command:
npm install -g react-native-cli
You can simply use npx react-native <command> it will work
npm install -g react-native-cli
But dont forget to restart command promprt
Your system or user environment PATH variable was edited, you can uninstall NodeJs and install it again or add the below path to the end of PATH variable into user variables the restart the Windows :
C:\Users\[USER-NAME]\AppData\Roaming\npm
this should work.
You need to setup the npm path in your environment variables. Please look at the images down below
Then follow the command : for installing -g ( global ) for cli in your system
npm install -g react-native-cli
I get the same error right off the bat on Windows 10 running in cmd window in adminstrator mode, however there is also a bash shell version of react-native that worked for me in a git bash window.
cmd:----------------------------------------------
C:\Users\David\Documents\react>where react-native
C:\Users\David\AppData\Roaming\npm\react-native
C:\Users\David\AppData\Roaming\npm\react-native.cmd
C:\Users\David\Documents\react>react-native init AwesomeProject
'react-native' is not recognized as an internal or external command,
operable program or batch file.
git bash:----------------------------------------
David#CYBER-PC ~/Documents/react
$ react-native init AwesomeProject
This will walk you through creating a new React Native project in c:\Users\David\Documents\react\AwesomeProject
Installing react-native package from npm...
Setting up new React Native app in c:\Users\David\Documents\react\AwesomeProject
AwesomeProject#0.0.1 c:\Users\David\Documents\react\AwesomeProject`-- react#15.3.1
To run your app on iOS:
cd c:\Users\David\Documents\react\AwesomeProject
react-native run-ios
- or -
Open c:\Users\David\Documents\react\AwesomeProject\ios\AwesomeProject.xcodeproj in Xcode
Hit the Run button
To run your app on Android:
Have an Android emulator running (quickest way to get started), or a device connected
cd c:\Users\David\Documents\react\AwesomeProject
react-native run-android
npm install -g react-native-cli
I had to add the %APPDATA%\npm folder to my PATH on Windows 10. Global modules are installed there.
If uninstalling and installing again the npm did not work on you, try adding %APPDATA%\npm to path (Environment variables) then quick reboot/restart. System Reboot should really be part of the process. This worked on my end.
Install :
npm install -g react-native-cli
Uninstall :
npm uninstall -g react-native-cli
If you are following the getting started guide for Windows/Android, they recommend installing nodejs via Chocolatey. But Chocolatey likes to have administrator rights when it installs things. If you're just a regular user, this seems to interfere with how npm installs react-native-cli. In my case, the react-native command was only recognized when I launched a command prompt as admin.
What I did to fix:
launched command prompt as admin
uninstalled react-native-cli globally: npm uninstall -g react-native-cli
uninstalled nodejs via Chocolatey: choco uninstall nodejs
Now, as a regular user without admin rights:
installed nodejs via the nodejs website (not Chocolatey)
installed react-native-cli globally: npm install -g react-native-cli
I uninstalled node.js and then reinstalled it, and it worked like a charm
just uninstall the node.js and reinstall it..
then install the cli package typing command
npm install -g react-native-cli..
now you are ready to make your project.
To make project open a folder from your drive wherever your folder is located.
Then type command
react-native init albums
it will create a project for you inside your directory.
None of the above mentioned solutions worked for me. What did work was to remove nodejs, and reinstall it via Chocolatey with the following command:
PS > choco install -y nodejs.install python2 jdk8
> npm install -g react-native-cli
C:\Users\user\AppData\Roaming\npm\react-native ->
C:\Users\user\AppData\Roaming\npm\node_modules\react-native-cli\index.js
+ react-native-cli#2.0.1
added 41 packages from 15 contributors in 4.528s
I had this problem also becuase I restored my files from a previous OS installation. My problem was a wrong prefix in my C:\Users\user_name\.npmrc file.
Run npm config list and make sure that all your npm config variables are leading to the correct file paths. Delete the .npmrc file if you want have it to go back to the defaults. That's what I did and react-native command is working for me again.
I hope this helps.
i have no clear idea but below steps worked for me.
delete Node Modules
Uninstall react-native cli. This is Recommended in the react-native Documentation
"If you previously installed a global react-native-cli package, please remove it as it may cause unexpected issues."
npm uninstall -g react-native-cli
clean gradlew. in your project folder, go to the android folder by typing cd android
and run gradlew clean
move back to your project folder cd .., then run
npx react-native run-android
these steps worked for me. took some time when running first time.
use node.js stable version or recommended version.
On window 10, nodejs>11 global node libraries seems to be installed in C:\Users\your_user_name.npm-global. So you need to set the variable to point to that path
I had problems because of this strange mistake.
I checked to see if it was globally loaded again
I didn't delete all packages
I even deleted C:\Users[USER-NAME]\AppData\Roaming\ npm manually, but there was no solution.
The only thing that is the solution is to use the current version of node.js.
uninstall nodejs completely(restart your pc) and reinstall it using chocolatey and follow other commands from https://facebook.github.io/react-native/docs/getting-started.
worked perfectly fine for me!
Even if you have installed react-native globally and still get the same try adding path of npm module (C:\Users\your user name\AppData\Roaming\npm) to system variables instead of user variables.
I know it's too late, anyway
Make sure you've added the path of the NPM in system variable rather than user variable in the System Environment Variables.
PATH : C:\Users\user_name\AppData\Roaming\npm
Open a the command prompt and type: npm config list:
Get the path underlined in red and add it your system path (change two back slashes into one), for example: C:\Users\YOURNAME\AppData\Roaming\npm.
This solved the issue for me
I just wrote "react-native -v" to console to check have I still react-native and then just I wrote "react-native run-android" again and this time it worked. Yes just that. React native is terrible technology.
Looks like I have uninstalled react native cli by mistake, I tried all answers mentioned above, but the below command worked for me.
npx react-native run-android.
Solution
I was facing 'react-native' is not recognized as an internal or external command,operable program or batch file error when I was running react-native start in VsCode.
I Solved it by running npm install -g react-native-cli in PowerShell
Steps to follow
run PowerShell as admin (important step)
run running npm install -g react-native-cli in PowerShell
close VsCode and rerun it
that's all!
I solve this problem by running
npm install -g react-native-cli
then another error appears
Command run-android unrecognized.
I fixed this error by
npm install
Use npx before your command
npx react-native
Not just
react-native
if you faced the same issue as me just type :
npm i react-native
then try to create a new project as its recommended by the react native doc by typing :
npx react-native init yourProjectName
this should resolve your problem
hope this was helpful
I have installed a third party library in my project but it is not working , so I want to delete that library from my project ,
How can I do that ?
If it is a library based only on javascript, than you can just run npm uninstall --save package_name or npm uninstall --save-dev package_name
If you've installed a library with native content that requires linking, and you've linked it with rnpm then you can do: rnpm unlink package_name then follow step 1
If you've installed a library with native content manually, then just undo all the steps you took to add the library in the first place. Then follow step 1.
note rnpm as is deprecated
I followed the following steps:--
react-native unlink <lib name> -- this command has done the unlinking of the library from both platforms.
react-native uninstall <lib name> -- this has uninstalled the library from the node modules and its dependencies
Manually removed the library name from package.json -- somehow the --save command was not working for me to remove the library declaration from package.json.
After this I have manually deleted the empty react-native library from the node_modules folder
If you want to unlink already installed packages in react native
$ react-native unlink package_name
$ yarn remove package_name (if it is npm then npm uninstall --save)
If you execute 2nd step before 1st step you need to install relevant package back and execute 2nd step
I will post my answer here since it's the first result in google's search
1) react-native unlink <Module Name>
2) npm unlink <Module Name>
3) npm uninstall --save <Module name
From react-native --help
uninstall [options] uninstall and unlink native dependencies
Ex:
react-native uninstall react-native-vector-icons
It will uninstall and unlink its dependencies.
You can delete installed react native package with this command.
npm uninstall package_name
example:
npm uninstall react-native-camera
remove package name from package.json file
delete package-lock.json file
then run npm install
or you can run the following command to uninstall any package
npm uninstall package_name
you have to check your linked project, in the new version of RN, don't need to link if you linked it cause a problem,
I Fixed the problem by unlinked manually the dependency that I linked and re-run.
For iOS...
Remove the node package and install the pods.
If you're using npm:
npm uninstall package-name
If you're using yarn:
yarn remove package-name
Then simply install pods with:
npx pod-install
Typically the package.json directory is in the root of your project folder, so you should run these from there. npx pod-install will go to your ios folder and will run pod install. You do not need to run this step if you are not adding/removing native components.
I think for Android it might be the same steps, but without running the latter command since Android does not use cocoapods.
Simple and easy solution.
npm uninstall --save react-native-image-slider-box
All of the top answers are a bit outdated. They do work, but the process could be better. So I'm going to post a more modern and 'normal' way.
Assumptions:
Your project is not overly old, meaning that your project is not using react-native version <0.60 (less than 0.60). This is because in the past (when you had react-native version <0.60), you had to manually run commands like react-native unlink when you wanted to uninstall a package. Those commands still work but are no longer necessary.
The library/package works with autolinking or it doesn't need linking at all because the package doesn't use native code. If the package's installation instructions don't require you to run a command to link the package (e.g. react-native link), then it uses autolinking or it doesn't need linking at all. A package might suggest you run the link command but they'll also usually say it's not required if your project's react-native is version >=0.60. The majority of libraries are like this now. I'd be surprised if the package you want to uninstall uses native code but doesn't support autolinking. Read more about autolinking.
If the package you want to uninstall doesn't use native code, then the above paragraph about autolinking doesn't matter.
You of course remembered to remove any use of the package in your project, before you try to uninstall it.
You've checked if other packages require the package you want to delete as a peer dependency. In this case, you removing that dependency can cause your other packages to not work.
If your package was installed without any manual editing of native files (e.g. android/settings.gradle, ios/yourappname/AppDelegate.m, etc.) or any other configuration (e.g. mypackage.config.js), then you should just do this:
If using npm, run npm uninstall <yourpackage>. If using yarn, run yarn remove <yourpackage>.
(React native uses autolinking to unlink the packages automatically so this is all you should need to do to 'unlink'. Read more.)
Run cd ios && pod install && cd ..
You can skip this step if you're absolutely sure that the package is purely written in JavaScript/Typescript. My opinion is to just run it anyway so that way your brain doesn't have to spend energy thinking/worrying about this.
That's it. You're good to go. If you're not good to go here, then something is very wrong.
If you did have to manually edit native files or any other extra configuration to install your package, then:
It's a good idea to get all the info you can on what you exactly did when you installed the package. Any additional context you can learn is good.
You should look at your git history to see the changes you did when you installed the package.
It's a good idea to read the package's README or docs to remind you of anything else you might have forgotten.
In addition to the package's most up-to-date README or docs, it's a good idea to try to read the package's README/docs from the exact version that you're trying to uninstall. If you just read the README from the package's main github page, for example, then the info might be too new.
Undo the manual changes you did when installing the package. Ideally, use git diff or a git GUI program to help you out with this. Because this process varies depending on the package and what you actually did, it's hard to be more specific than that.
If using npm, run npm uninstall <yourpackage>. If using yarn, run yarn remove <yourpackage>.
(React native uses autolinking to unlink the packages automatically so this is all you should need to do to 'unlink'. Read more.)
Run cd ios && pod install && cd ..
You can skip this step if you're absolutely sure that the package is purely written in JavaScript/Typescript. My opinion is to just run it anyway so that way your brain doesn't have to spend energy thinking/worrying about this.
That's it, done. If things are not good at this point, then something is very wrong.
Remember to upvote if you feel this helped you, so it can be more visible. Thanks!
Uninstalling local packages:
npm uninstall <package_name>
for example:
npm uninstall react-native-webview
Uninstalling global packages:
npm uninstall -g <package_name>
for example:
npm uninstall -g react-native-webview