what is the difference between npm install -g react-native-cli versus using npx react-native init <project name>? - reactjs

**what is the difference between setting up react-native- cli with npm install -g react-native-cli and init versus using npx react-native init ?
I recently got a lot of eneont errors while developing react-native app. firstly i setup my system with npm install -g react-native and was working fine but later while installing dependencies they got eneont errors like could not find fsevent, nanoid, hammerjs etc.
And the official documentation includes setup to use npx. I really got confused with this sort of approach.
could you please light some knowledge on npm vs npx and installing with '-g' argument?

npx is a npm package runner (x probably stands for eXecute). The typical use is to download and run a package temporarily or for trials.
With npm you install the package on your machine. And global makes it available to all your projects not only the one where you currently work in.

As yesIamFaded pointed out, the npx command does indeed download the package for each time you run the code and from a networking standpoint it might beneficial. However, as per React-Native documentation (which you can find here) the cli has been deprecated and it may cause issues. To quote the doc:
If you previously installed a global react-native-cli package, please remove it as it may cause unexpected issues.
So personally i would not go near it.

Related

What is the difference between npm init vite#latest and npm init vite?

I recently started using vite to make my react apps as I grew tired of the excruciatingly long install times for create-react-app. However, as I looked online, I found different ways of making a vite app. On the official documentation, it says to use npm init vite#latest while other tutorials use npm init vite. Both require you to install different dependencies on your machine before you can run the commands. However, it appears that they both do essentially the same thing. Can anyone explain the difference between the 2 commands?
The difference between the two, is, npm init vite#latest will download the latest version - and npm init vite will use create-vite if you had it previously globally installed, or it will fetch the latest version. that's it. Read below 👇
When you get #latest on some tutorials, you can see it as an explicit information in order to not confuse the reader, but they should stipulate the following note.
Note:
IF you had already the create-vite package globally
installed, and for example, a older version, it will be what npm init uses.
So:
npm init foo fetches and runs the already installed create-foo OR the latest create-foo from the registry if not.
npm init foo#latest fetches and runs the latest create-foo from the registry.
npm init foo#1.2.3 runs create-foo#1.2.3 to install the package version 1.2.3 specifically.

Issue in generating react js first project

I'm trying to generate react project but command prompt freezes and shows no progress in the middle
enter image description here
Tried several times by re opening but did not find result.
My guess is that npx is downloading packages needed to run create-react-app and that is why you experience lag.
Possible solutions:
Make sure you have enough space on you computer, RAM memory, hard disk memory.
Wait a bit longer untill all packaged are installed.
If that doesn't help, try installing create-react-app globally npm i -g create-react-app and run it as regular npm command: create-react-app project-name
If that still doesnt help, i suggest installing another command terminal, like ConEmu (https://conemu.github.io/) which supports install animation (progress bars and stuff).
Good luck.
I was able to solve this problem by updating npm to latest version
Try updating npm if available by command:
npm install npm#latest -g
and try cleaning npm cache
npm cache clean
https://docs.npmjs.com/cli/cache.html

Requested item is quarantined in Reactjs

I am trying to run the command npx create-react-app under a corporate registry. The problem is that the element sockjs#0.3.18 is not available and therefore it stalls the installation; however, the element sockjs#0.3.17 is. Is there any way I can run that command by specifying it should install a different version of sockjs?.
Using npm ls sockjs, I see this is a dependency of react-scripts#1.1.4 / webpack-dev-server#2.9.4
└─┬ react-scripts#1.1.4
----└─┬ webpack-dev-server#2.9.4
--------└── sockjs#0.3.18
There's an option in create-react-app to use a nonstandard version of react-scripts:
--scripts-version <alternative-package>
This should work:
npx create-react-app --scripts-version 0.9.5 app
0.9.5 is the latest version that depends on an earlier sockjs.
I found this by looking up the package.json of webpack-dev-server and then react-scripts that had appropriately downgraded versions. (I did it manually on GitHub release pages... anyone know a better tool for that?)
Alternative approaches:
Get the updated sockjs approved in your corporate registry :)
Assuming the difference between sockjs#0.3.18 and sockjs#0.3.17 is immaterial as for as create-react-app goes (no guarantees), you could probably npm install create-react-app, find the bit in the source code (node_modules/create-react-app/create-react-app.js) that downloads react-scripts, and hack it to point to your own fork of the latest react-scripts with a changed version number for webpack-dev-server (1.16.4). Not recommended!

Installing Definitely Typed packages in VS 2015 RC AspNet5 using Gulp and TSD

I am trying to install angular.d.ts in my MVC6 application and am running into major headaches.
I have set up Gulp to "REINSTALL" any packages I need using tsd, but I cannot figure out how to get the packages installed in the first place. All the instructions tell me to run tsd install xxx or some such but I cannot get Windows to recognize it. I realize I can add it to my path etc. But everyone seems to think I can just run it. Is there some trick I never learned in VS in regards to this?
You should either:
Install tsd globally: npm install -g tsd.
or
Use local executable: ./node_modules/.bin/tsd.

Yeoman - Errors With Grunt Server Command

I already have npm and git installed on my Ubuntu machine.
I followed the instructions below when installing Yeoman and the generator-angular.
Kickstart Your AngularJS Development with Yeoman, Grunt and Bower (step by step tutorial)
http://www.sitepoint.com/kickstart-your-angularjs-development-with-yeoman-grunt-and-bower/
My ultimate goal is to lauch a simple app using twitter bootstrap, so I can take advantage of their pretty UI. :D
However, when I get to the portion to run grunt server (recently replaced by grunt serve), I get a rediculous number of errors:
I was previously suffering from the issue described below:
Cannot install yeoman because 'generator-karma does not satisfy its siblings peerDependencies
https://github.com/yeoman/yeoman/issues/1065
Luckily I was able to work around it by running npm uninstall -g generator-karma && npm install -g generator-angular and then sudo npm install -g yo grunt-cli bower.
However, now I've hit a wall with grunt appearing as if it's not installed at all.
Does anyone know if there is a specific location where grunt should be installed?
Should I install it globally (using -g)?
Should I not install it globally (using -g)?
I don't understand what I'm doing incorrectly, but it must be something fundamental because the process is intended to be automated and simple.
Any ideas?
This looks like something npm install would fix. Looks like some of your dependencies didn't install.
Try it first without -g.
The problem definitely has something to do with compass and ruby. I was able to quickly build an angular app using yeoman when I opted not to install compass/sass for the app when prompted after typing yo angular at the terminal. After following the suggestions in this post, the last error I got was the following error:
Warning: /home/ubuntu/.rvm/rubies/rubie-2.1.1/lib/ruby/2.1.0/rubygems/core_ext/kernel_req‌​uire.rb:55:in 'require': cannot load such file -- compass (LoadError) from /home/ubuntu/.rvm/rubies/rubie-2.1.1/lib/ruby/2.1.0/rubygems/core_ext/kernel_req‌​uire.rb:55:in 'require' from /usr/bin/compass:20:in 'block in ' from /usr/bin/compass:8:in 'fallback_load_path' from /usr/bin/compass:19:in '' Use --force to continue Although, --force doesn't help.
but fixed it by simply following these instructions.

Resources