I am not sure what to do about this as every time I use create_react_app it does
Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts...
Even though I have checked that react, react-dom, and react-scripts packages already exist in global install location.
How do I stop create_react_app from reinstalling globally installed packages ?
create_react_app uses npm and for npm packages, it should only be installed globally when it provides an executable command that you run from the shell (CLI). it's npm's way to keep all the applications packages inside the node_modules to avoid conflicts, npm is different compared by something like bundler if you used it before. so the simple answer this the right way of npm and it's not needed to be changed even if this might appear like a waste of resources
Related
hi i have a problem when i create creat app it build with yarn and i didn't use yarn in my life and when i use npm to install any think it show a problems i tried to use (create-react-app my-project --use-npm) and i removed yarn.lock i found the same problem and when i install any package with npm it show me a message 58 vulnerabilities (16 moderate, 40 high, 2 critical)
the images:
https://cdn.discordapp.com/attachments/811324614901760041/905436370363883520/unknown.png
https://cdn.discordapp.com/attachments/811324614901760041/905436302948831312/unknown.png
https://media.discordapp.net/attachments/811324614901760041/905434979037765642/unknown.png?width=1108&height=623
https://cdn.discordapp.com/attachments/811324614901760041/905434979037765642/unknown.png
https://cdn.discordapp.com/attachments/811324614901760041/905433250971926609/unknown.png
To take root of your question, you have both yarn and npm installed.
create-react-app uses yarn for the setup if it's installed. Yarn is a Facebook initiative too, so it's just a preference of react-app creators to lean more to yarn or rather Facebook initiated products and initially it was also believed to be more secure than npm and with a faster performance too.
Glad you have noted --use--npm so you can specify always what you want to use when overriding yarn.
In terms of not using yarn before, don't stress, learn the new tool because Yarn drew inspiration on top of npm, so cli commands are not to far-off.
In terms of the vulnerabilities, let me point to package dependencies. With npm apparently since v6, when starting a new project, this always was a concern. Best thing to do is to audit your packages and find dependencies and resolve or reduce those vulnerabilities by either going to specific versions required or the #latest. It is also worthy to check out your node version, somewhat most devs online say the older versions are more stable and often the vulnerabilities are in react-scripts which are part of the build process. Also, remember that you would be running preset templates so its really worth it to check also npm audits or yarn whys. Also do either an npm outdated or yarn outdated so you can assess properly the state.
Have a great yarn journey!!!
I am making a React app.
I npm installed bootstrap, vulnerabilities popped up afterwards.
Here is an example of two items from npm audit
What I tried:
I installed and ran npm-check-updates, which updated a few modules, but the problems persist.
I have tried to update the individual packages listed in npm audit, but not all 'instances'? of that package get updated on my machine. Example below.
All browserslist packages are >=4.16.5 except the one of the last line. npm update browserslist is not working on it.
this is npm list browserslist
This command will resolve most of the conflicts
npm audit fix
Try to delete the node_modules folder and package-lock.json / yarn.lock.
Now, run yarn if you use yarn
OR
npm i if you use NPM. It should fix.
If something goes wrong - NPM will tell you to run npm audit fix
What just worked is going into package-lock, manually finding all instances of a package, say, browserslist, and making sure it's version is set to the newest version.
Then npm ci to reinstall all modules from package-locked.
This was a pain in the ass to do for all the packages and I don't know if there was a better way. No other methods seemed to work...
Let me know what your thoughts are on this.
npm start
pushercoins#0.1.0 start
react-scripts start
There might be a problem with the project dependency tree.
It is likely not a bug in Create React App, but something you need to fix locally.
The react-scripts package provided by Create React App requires a dependency:
"eslint": "^7.11.0"
Don't try to install it manually: your package manager does it automatically.
However, a different version of eslint was detected higher up in the tree:
/Users/sujit_jaiwaliya/node_modules/eslint (version: 6.8.0)
SOLUTION:
This worked for me I hope it does the same to you guys:
I Unistall eslint version 6.8.0 :
npm uninstall eslint#6.8.0
Then I install eslint#7.11.0:
npm i eslint#7.11.0
Then i run fix audit:
npm audit fix --force
Then i changed the DIR file by adding a .env file with this code in it :
ESLINT_NO_DEV_ERRORS=true
This issue has been fixed in the react-scipts:"4.0.3" but, the eslint errors present in the project are not converted to warnings by default. You have to create an .env file that should contain a ESLINT_NO_DEV_ERRORS=true flag. Due to this flag, you will receive the eslint errors as warnings and not as errors in the development.
This flag is ignored during production and when they are any git hooks running, which will, in turn, cause an error when you are trying to commit the code with an eslint error in it.
This is because you already have some other version of eslint installed. To resolve this, first remove that version (in this case 6.8.0) and then again run
npm start
Uninstall the other version using npm uninstall eslint
I started the project with the right versions of everything but somewhere my code broke and started requesting a different version of eslint. "react-scripts" was the only package that had eslint as a dependency.
I tried npm uninstall eslint but it didn't quite work. So I removed react-scripts and then reinstalled it as below
npm uninstall react-scripts
npm install react-scripts.
You might want to install the specific version that was installed before. If your current version is 4.0.3 then when installing just add it at the end like this npm install react-scripts#4.0.3 on step 2 above.
It totally removed the error for me, hope it does for you too.
Why is it necessary to run 'npm install' when I already have all the dependence in node_module folder.
After running 'npm install' successfully on my machine, I want to setup same project on another machine, why do I require run 'npm install' again when I already have downloaded all the dependence in node_module folder?
First of all I want to inform you 2 things:
As your project depend on some packages (node_modules), same as some packages are dependent on other packages.
when we install some package with command npm install package -g then -g will install it in global folder which can be accessed by any project. by using -g, package is not added to node_modules.
Now here is answer of your problem. There might be possible that some dependencies of packages are installed as global on one machine and not on other one. This can happen as developers work on many project on same machine and might be they have installed global packages. So in this case you need to execute npm install command.
npm install extract all your dependencies from your package.json, download it and save them in your node_modules folder. You don't need to run npm install again and again if you already have installed all your dependencies locally.
When ever you installs a new dependency you run npm install <package-name> --save and why --save for the first time? because it adds the new installed dependency on your package.json. We never push node_modules to our git repo only the updated package.json is pushed to repo. In that case if a new person pulls your code from the repo he is only going to run npm install and all the dependencies mentioned on your package.json will going to available on his project locally. Thats a small intro about why we use package.json hope it helps.
Check the version of node in both system .
I guess that would be issue. you local system would have either higher version than the server. May be not able to compile for higher version make sure the version are same for node in both , to reduce the comflict.
I learned about Yarn and wanted to try it with React so I installed Yarn, and now when I run create-react-app hello, one of the scripts appear to be yarn add v0.24.6, which installs 879 dependencies into my node_modules directory.
Why is this happening and how do I make it stop? Or do I just not understand Yarn and this is supposed to be something I want?
Were you using npm2 before? With it, you'd only see your app's direct dependencies in node_modules and their dependencies (i.e. your app's transitive dependencies) would be tucked away in nested node_modules dirs.
Yarn and npm >= 3 flatten dependencies in node_modules, so you're seeing all of react-scripts' direct dependencies and all of its transitive dependencies.
Every package we use might depends on others packages.
yarn and npm > 3 use flat structure for resolving dependencies of other packages dependencies. So, your node_modules folder container long list of folders.
npm < 3 use nested tree structure. So, your node_modules folder container few list of folders and dependencies of other packages nested inside package/node_modules folders.
so, why use npm > 3 or yarn?
Those are fast for resolving dependencies. I hope you have not yet experience on waiting for 1hours or more after npm install :D.
why yarn over npm?
There are lots of articles written on this topic. Just google it.