installing npm modules removes react-native-cli - android

I have a react-native project where I install modules using
npm install some-module -save
package.json includes react-native-cli
Now, every time I do this the command react-native run-android is not available anymore. I have to run
yarn add react-native-cli
in order for it to be available again. Also, the gradle file of some modules get out of sync when I do this which means running Android Studio and updating these.
I find this very confusing. Earlier in the project, I was only using npm and had no problems.

i think you can try this
npm install -g <package> --save

Related

React Navigation Error on npm install

I'm trying to create a new react native app with react navigation.
I did the following:
1.) create-react-native-app myAppName
2.) cd myAppName/
3.) npm install --save react-navigation
4.) Expecting successful installation of react-navigation but instead i get:
C:\Users\Maima\Documents\GitHub\React\test>npm install --save react-navigation
npm WARN rm not removing C:\Users\Maima\Documents\GitHub\React\test\node_modules
\.bin\jest.cmd as it wasn't installed by C:\Users\Maima\Documents\GitHub\React\t
est\node_modules\jest
npm WARN rm not removing C:\Users\Maima\Documents\GitHub\React\test\node_modules
\.bin\jest as it wasn't installed by C:\Users\Maima\Documents\GitHub\React\test\
node_modules\jest
npm WARN rm not removing C:\Users\Maima\Documents\GitHub\React\test\node_modules
\.bin\rimraf.cmd as it wasn't installed by C:\Users\Maima\Documents\GitHub\React
\test\node_modules\rimraf
npm WARN rm not removing C:\Users\Maima\Documents\GitHub\React\test\node_modules
\.bin\rimraf as it wasn't installed by C:\Users\Maima\Documents\GitHub\React\tes
t\node_modules\rimraf
npm WARN rm not removing C:\Users\Maima\Documents\GitHub\React\test\node_modules
\.bin\uuid.cmd as it wasn't installed by C:\Users\Maima\Documents\GitHub\React\t
est\node_modules\uuid
npm WARN rm not removing C:\Users\Maima\Documents\GitHub\React\test\node_modules
\.bin\uuid as it wasn't installed by C:\Users\Maima\Documents\GitHub\React\test\
node_modules\uuid
npm WARN rm not removing C:\Users\Maima\Documents\GitHub\React\test\node_modules
\.bin\semver.cmd as it wasn't installed by C:\Users\Maima\Documents\GitHub\React
\test\node_modules\semver
npm WARN rm not removing C:\Users\Maima\Documents\GitHub\React\test\node_modules
\.bin\semver as it wasn't installed by C:\Users\Maima\Documents\GitHub\React\tes
t\node_modules\semver
npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN react-navigation#1.0.0-beta.23 requires a peer of react#* but none is i
nstalled. You must install peer dependencies yourself.
npm WARN react-navigation#1.0.0-beta.23 requires a peer of react-native#* but no
ne is installed. You must install peer dependencies yourself.
npm WARN react-native-tab-view#0.0.74 requires a peer of react#* but none is ins
talled. You must install peer dependencies yourself.
npm WARN react-native-tab-view#0.0.74 requires a peer of react-native#* but none
is installed. You must install peer dependencies yourself.
npm WARN react-native-drawer-layout-polyfill#1.3.2 requires a peer of react-nati
ve#* but none is installed. You must install peer dependencies yourself.
npm WARN react-native-drawer-layout#1.3.2 requires a peer of react#* but none is
installed. You must install peer dependencies yourself.
npm WARN react-native-drawer-layout#1.3.2 requires a peer of react-native#* but
none is installed. You must install peer dependencies yourself.
+ react-navigation#1.0.0-beta.23
added 8 packages, removed 973 packages and updated 20 packages in 259.667s
Please Help, Cant npm start my React Native App.
It can be solved by running a npm install command again and reinstall the npm install --save react-navigation command.
I cant comment because I dont have the points, so heres a tentative answer with the info at the moment:
I had similar issue when running Expo on Windows. to solve I had to close XDE and reinstall.
if that's not enough, delete the "node_modules" folder and run "npm install".
They aren't errors, just warnings telling you that some peer dependencies that navigation relies on aren't installed. Based on your commands, you need to run npm install or yarn install to install all the packages. Creating the app with create-react-native app give you a list of packages but you have to actually install them with npm install. If something funky happens, do what #vbandrade suggested and hose your node_modules and package.lock, then do a fresh npm install
The same error appeared when I tried to run npm install --save react-navigation. Turns out I needed to run npm install prior to npm install --save react-navigation.
Followed the steps but got error with npm install. I am also using Expo (as mentioned by #vbandrade) and there are also problems with that. First of all, i think react-navigation is changing a lot. After trying a lot (before applying the solution in the accepted answer), i installed react-navigation and its dependencies multiple times and it worked at one time when i first ran;
npm install react-navigation
then
npm install #react-navigation/native
(which doesn't make too sense for me as that gets auto installed with react-navigation). Then i ran;
npm install react-native-reanimated react-native-gesture-handler react-native-screens react-native-safe-area-context #react-native-community/masked-view
for installing dependencies and it worked. Honestly i didn't understood anything that how it worked. So for the sake of learning i installed the project and reinstalled it with expo and after that nothing worked. So i applied #vbandrade's answer but it was giving some more errors after i ran npm install.
To get rid of these errors, i found another solution (from stackoverflow). Here is that solution.First of all delete node_modules folder and package-lock.json file and close your editor or any other file where your project is open (because node doesn't install some packages if the project is open).
Then,
First run this command;
npm cache clean --force
Then,
npm install
And then;
npm install react-navigation
And at last install the dependencies;
npm install react-native-reanimated react-native-gesture-handler react-native-screens react-native-safe-area-context #react-native-community/masked-view
Run your project;
If using expo;
expo start
Errors must be gone now.
If you are running your expo server, stop the server and continue npm install --save react-navigation . It worked for me.

the development server returned response error code 500 - react native - ./configs/main

I got this error when i tried to make hello-world sample:
react-native init hello_world
cd hello_world
react-native run-android
Even when I ran:
npm install -g react-native-git-upgrade
react-native-git-upgrade
I got same error on commend line console.
I've searched and tried many solutions but it doesn't seem to work:
Example:
* upgrade react-native
* using watchman watchman watch-del-all
* remove node_modules
* clean cache npm cache cleanor npm start -- --reset-cache
Operation: Window 8
react-native-cli: 2.0.1
react-native: 0.44.2 ( tried 0.47.1 too )
Android: Simulator Nexus5X
Thank you all in advance!
Delete babel-preset-react-native folder inside node_modules and then install older version 2.1.0 of this library with npm install babel-preset-react-native#2.1.0 --save-dev.
In case if someone is using react-native: 0.57.1 or the latest one,babel-preset-react-native has been replaced by metro-react-native-babel-preset. if you still get 500 error while connecting to the device do the below step and I guess things will be fine
npm add #babel/runtime
npm install
Downgrade the following:
react-native init Project
cd Project
npm uninstall react-native
npm install --save react-native#0.55.4
npm uninstall --save babel-preset-react-native
npm install --save babel-preset-react-native#4.0.0
react-native run-android
For me it's about the react native version. I just install the new version of react native "0.59.2" then i downgrade to previous version to "0.55.2", and everything works fine.

npm WARN react-native-maps#0.14.0 requires a peer of react#>=15.4.0 but none was installed

Problem
I'm trying to install react-native-maps by Airbnb in my project. Installation instructions:
airbnb/react-native-maps/installation
When I run the following command in cmd: npm install react-native-maps --save
This is what I get:
`-- react-native-maps#0.14.0
npm WARN react-native-maps#0.14.0 requires a peer of react#>=15.4.0 but none was installed.
Ignoring this if I proceed with further installation, and run the following command: react-native link react-native-maps
This is what I get:
Scanning 561 folders for symlinks in C:\RNProjects\Mapp\node_modules (39ms)
rnpm-install info Linking react-native-maps ios dependency
rnpm-install info iOS module react-native-maps has been successfully linked
^As we can see, only iOS related maps modules get installed. On checking the project directory, I was able to validate that no android related module was installed.
Troubleshooting
Here's the list of thing I tried to resolve the issue, but none of them worked.
Tried installing npm install react#15.4.0 --save
Got these warnings:
npm WARN react-native#0.43.3 requires a peer of react#16.0.0-alpha.6 but none was installed.
npm WARN react-test-renderer#16.0.0-alpha.6 requires a peer of react#^16.0.0-alpha.6 but none was installed.
So, in order to resolve this, I tried installing react#16.0.0-alpha.6 with: npm install react#16.0.0-alpha.6.
I got the same message again:
npm WARN react-native-maps#0.14.0 requires a peer of react#>=15.4.0 but none was installed.
Tried updating react-native npm update react-native.
Still getting the same warning message.
Tried installing the latest version of npm: npm install npm#latest -g.
Didn't work.
Additional Information
react-native: 0.43.3
react-native-cli: 2.0.1
Platform: Android
Development Operating System: Windows 10 OS
Here's how I was able to solve this (chronological order):
Deleted node_module directory from the project
npm cache clean
Modified package.json with: "react":"~15.4.1"; "react-native":"0.42.3"; "react-test-renderer":"15.4.1"
npm install all module
npm install
npm i react-native-maps#0.12.5 --S
react-native link react-native-maps
Once I do this, it's successfully able to link the android and ios react-native-modules to the project.
Note: Before running the react-native run-android command,
Run: cd android && gradlew clean && cd .. && react-native run-android.
This will clean the gradle before running and help in avoiding any errors.
You can try:
delete node_module, npm cache clean;
modify package.json
"react": "~15.4.1","react-native": "0.42.3","react-test-renderer": "~15.4.1",
npm install all module;
done ;)
Here is how i was able to solve this same issue:
I deleted the node_module folder (You can verify npm cache: npm cache verify)
I actually changed the package.json file to the following:
"react": "~15.4.1","react-native": "0.42.3","react-test-renderer": "~15.4.1"
But that triggered other error on my side; So i put them back to their initial
values:
a. "react": "17.0.1",
b. "react-native": "0.64.0",
c. "react-test-renderer": "17.0.1"
npm install all module
npm install
npm audit fix --force
npm i react-native-maps#0.12.5 --S
react-native link react-native-maps
At this point I opened 2 terminals:
a. Terminal 1: react-native start
b. Terminal 2: react-native run-android or yarn android

Can't install react-native-cli after following tutorial

Before reading and following the tutorial in NPM I installed the react-native-cli globally and it worked just fine
But in the tutorial it asks you to install sinopia
https://www.npmjs.com/package/react-native-cli
Then it gives you these instructions
react-native$ npm set registry http://localhost:4873/
react-native$ npm adduser --registry http://localhost:4873/
# Check that it worked:
react-native$ npm config list
react-native$ npm unpublish --force
react-native$ npm publish
react-native$ cd react-native-cli/
react-native-cli$ npm unpublish --force
react-native-cli$ npm publish
But the unpublish part gave me an error. the same for the 'publish' aprt.
(By the way, publish what?!)
Then it says to uninstall react-native-cli
npm uninstall -g react-native-cli
After that I couldn't reinstall react-native-cli.
It says the package is not available.
npm ERR! 404 no such package available : react-native-cli
npm ERR! 404
npm ERR! 404 'react-native-cli' is not in the npm registry.
What is this?! How can I fix it?
#edit
By the way, I don't understand why, in the Get Started tutorial it doesn't tell us how to install the react-native-cli nor gives us a link. It just states:
The React Native CLI #
Node.js comes with npm, which lets you install the React Native command line interface.
#edit2
I just managed to install react-native-cli by removing the 'registry' entry from npm config, installing it and adding Sinopia again.
I thought Sinopia worked as a proxy. If it is not found in local repository, it looks for it in NPMJS...
I even tried to install other things and I could (wdio, nodemon), I just got an error with react-native-cli.
It seems that something is wrong.
Seems like you on Windows
I don't think you need sinopia.
Tutorials was little improved on master branch of the docs: http://facebook.github.io/react-native/releases/next/docs/getting-started.html
In short:
Install node.js
Install react-native-cli: npm install react-native-cli
Install & setup Android SDK
Create & run project
react-native init AwesomeProject
cd AwesomeProject
react-native start
react-native run-android

How do I create a React Native project using Yarn?

I am running the following commands in the DOS console on a Windows 7 (64-bit) machine.
npm install -g yarn
yarn add global react-native
yarn add global react-native-cli
react-native init sample
After running react-native init sample, the console was closed.
The error log shows:
D:\Mobile>"$basedir/../../Users/pramaswamy/AppData/Local/Yarn/.global/node_modules/.bin/react-native.cmd" "$#"
D:\Mobile>exit $?
I think you're adding global dependencies wrong, and you shouldn't need to install react-native, globally or locally. react-native init will create a package.json with react-native listed as a dependency.
You should be able to install react-native-cli globally with yarn global add react-native-cli, not yarn add global react-native-cli.
Here yarn run android command will be used to run the react native app using yarn package manager, and yarn start will start the node JS server.
You should be fine with running the following:
npm install -g yarn
yarn global add react-native-cli
react-native init sample
yarn run android
yarn start
NEW SEP 2019,
now it's more simple, use node10 and expo: (easy way)
npm install -g expo-cli
*to create project:
expo init AwesomeProject
cd AwesomeProject
npm start
*install the app 'expo' on your phone, and scan the qr code for the project and you can start to view your app
more info:
https://facebook.github.io/react-native/docs/getting-started.html
UPDATE OCT 2018 Create React Native App (now discontinued) has been merged with Expo CLI
You can now use expo init to create your project. See Quick Start in
the Expo documentation for instructions on getting started using Expo
CLI.
Unfortunately, react-native-cli is outdated. Starting 13 March 2017, use create-react-native-app instead. Moreover, you shouldn't install Yarn with NPM. Instead, use one of the methods on the yarn installation page.
1. Install yarn
Via NPM. According to its installation docs, you shouldn't install yarn via npm, but if necessary, you can still install it with a pre-v5 version of npm.
UPDATE 2018 - OCTOBER
Node 8.12.0 and NPM 6.4.1 is already compatible with create-react-native-app. Really some minors previous versions too. You don't need more downgrade your npm.
On Ubuntu.
curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | sudo apt-key add -
echo "deb https://dl.yarnpkg.com/debian/ stable main" | sudo tee /etc/apt/sources.list.d/yarn.list
On macOS, use Homebrew or MacPorts.
brew install yarn
sudo port install yarn
2. Install the Create React Native App
yarn global add create-react-native-app
3. Update your shell environment
source ~/.bashrc
4. Create a React native project
create-react-native-app myreactproj
You got the order wrong. You should be
yarn add global react-native-cli
yarn add react-native
react-native init sample
Please You visit Bug
yarn global add react-native-cli
with
react-native --version
and I get "$basedir/../../Users/juvasquezg/AppData/Local/Yarn/config/global/node_modules/.bin/react-native.cmd" "$#"
the system cannot find the path specified
Go to C:\Program Files\nodejs and I saw:
react-native
react-native.cmd
react-native.cmd.cmd
The fix is to delete react-native.cmd and rename react-native.cmd.cmd to react-native.cmd
The Solution #1324 (comment)
You could also do
yarn dlx expo-cli
then:
expo init project_name
and follow the instructions
after finishing cd project_name and try
yarn web
It is now:
yarn dlx create-react-native-app
then follow the instructions.
cd project_name into the project folder and do:
yarn install
then try with:
yarn web
If you want to create app using yarn instead of npx;
yarn dlx react-native init ExampleApp this command will be helpful.
According to the react native documentation we should use npx react-native init AwesomeProject command
For more info about "yarn dlx": https://yarnpkg.com/cli/dlx
Yarn global is deprecated. If you run yarn global you will get an error.
Usage Error: The 'yarn global' commands have been removed in 2.x -
consider using 'yarn dlx' or a third-party plugin instead
But yarn dlx won't work like yarn global or npm install <module> --global

Categories

Resources