We Keep Coding

node_modules vanishes and doesn't install any dependency for react app and throws error

I am trying to install a react app but am unable and it always gives the below error and the whole node_modules folder vanishes.
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! Found: react-scripts#5.0.1
npm ERR! node_modules/react-scripts
npm ERR! react-scripts#"5.0.1" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react-scripts#"^4.0.0" from #craco/craco#6.4.5
npm ERR! node_modules/#craco/craco
npm ERR! #craco/craco#"^6.4.3" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See /Users/xoxo/.npm/eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/xoxo/.npm/_logs/2023-01-24T15_48_03_164Z-debug-0.log
And it is not also letting me install react-app-rewired
I tried with --force and --legacy-peer-deps but no luck, I am stuck at this since 3 hours, not able to reslove it from anywhere. Also tried methods told for clearing cache and installing again, but no luck their either.
Also for some private packages had used npm auth with $NPM_TOKEN but still gave the below error:
npm auth
npm ERR! code EUSAGE
npm ERR!
npm ERR! Manage package owners
npm ERR!
npm ERR! Usage:
npm ERR! npm owner add <user> <package-spec>
npm ERR! npm owner rm <user> <package-spec>
npm ERR! npm owner ls <package-spec>
npm ERR!
npm ERR! Options:
npm ERR! [--registry <registry>] [--otp <otp>]
npm ERR! [-w|--workspace <workspace-name> [-w|--workspace <workspace-name> ...]]
npm ERR! [-ws|--workspaces]
npm ERR!
npm ERR! alias: author
npm ERR!
npm ERR! Run "npm help owner" for more info
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/xoxo/.npm/_logs/2023-01-26T07_54_36_914Z-debug-0.log

Solved the above with:
deleting and again cloning the project
created npmjs token required for custom private packages, updated .envrc with it.
so npm i still failed hence used npm i --legacy-peer-deps after npm cache clean --force
Voila! all dependencies got installed
The mistake I was first doing was trying npm auth, which is not required as npm fetches it from the .envrc and the .npmrc file
Hence, try using these steps if you find any difficulty similar to this

Why is Mock Service Worker not installed in React project with Typescript support?

I want to include Mock Service Worker into my React project with Typescript support, but as soon as I run npm install msw --save-dev command, my terminal shows me these error messages:
PS F:\Programming\React Practices\ReactPizza\my-app> npm install msw --save-dev
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: msw#0.41.0
npm ERR! Found: typescript#4.7.2
npm ERR! node_modules/typescript
npm ERR! peer typescript#">= 2.7" from fork-ts-checker-webpack-plugin#6.5.2
npm ERR! node_modules/fork-ts-checker-webpack-plugin
npm ERR! fork-ts-checker-webpack-plugin#"^6.5.0" from react-dev-utils#12.0.1
npm ERR! node_modules/react-dev-utils
npm ERR! react-dev-utils#"^12.0.1" from react-scripts#5.0.1
npm ERR! node_modules/react-scripts
npm ERR! react-scripts#"5.0.1" from the root project
npm ERR! peerOptional typescript#"^3.2.1 || ^4" from react-scripts#5.0.1
npm ERR! node_modules/react-scripts
npm ERR! react-scripts#"5.0.1" from the root project
npm ERR! 2 more (tsutils, the root project)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peerOptional typescript#">= 4.2.x <= 4.6.x" from msw#0.41.0
npm ERR! node_modules/msw
npm ERR! dev msw#"*" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: typescript#4.6.4
npm ERR! node_modules/typescript
npm ERR! peerOptional typescript#">= 4.2.x <= 4.6.x" from msw#0.41.0
npm ERR! node_modules/msw
npm ERR! dev msw#"*" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\Win10\AppData\Local\npm-cache\eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Win10\AppData\Local\npm-cache\_logs\2022-05-27T17_17_28_323Z-debug.log
I don't know what the matter is, and how to fix it.
My mini-project is powered by create-react-app. I mean the project was started out with this:
npx create-react-app my-app --template typescript
When I don't utilize Typescript with npx create-react-app everything is going well.
You may easily check those error messages on GitHub:https://github.com/AlexKor-5/ReactPizzaApp_Ts/tree/5849bb4cb928550dcb4bfd66ecb8b7bf0757fb9f by an attempt to install MSW.

I can only assume you're using npm 7 (since npm 6 would automatically force install it). And it's telling you what the issue is, a conflicting peer dependency, typescript.
It's also telling you how to fix it:
Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
Aka:
npm install --legacy-peer-deps
Otherwise reinstall a later/earlier version of either package so the peer dependencies can match up. Msw is using ">= 4.2.x <= 4.6.x" typescript and you have typescript#4.7.2 installed, it's breaking because msw doesn't accept your typescript version.

React Codemirror2 does not install

When I try to install react-codemirror2 it gave an error and doesn't install in my app (my react version is #17.0.2) Why it doesn't install?
Error list in below 👇🏻
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: code-editor-with-react#0.1.0
npm ERR! Found: react#17.0.2
npm ERR! node_modules/react
npm ERR! react#"^17.0.2" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react#">=15.5 <=16.x" from react-codemirror2#7.2.1
npm ERR! node_modules/react-codemirror2
npm ERR! react-codemirror2#"*" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\Mahdi\AppData\Local\npm-cache\eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:

If anyone else has the same problem like me
He/she can just install "react-codemirror2-react-17" instead "react-codemirror2"
It worked for me.

I faced a similar error message.
Try using npm install react-codemirror2 --legacy-peer-deps

After writing:
"engines": {
"node": "14.x"
}
in package.json, react-codemirror2 worked correctly

How to install react-paystack in Visual Studio

I am trying to install react-paystack and I am getting this error
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: myfapp#0.1.0
npm ERR! Found: react#17.0.2
npm ERR! node_modules/react
npm ERR! react#"^17.0.2" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react#"^15.0.0 || ^16.0.0" from react-paystack#3.0.4
npm ERR! node_modules/react-paystack
npm ERR! react-paystack#"*" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\Jeffrey Matthew\AppData\Local\npm-cache\eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Jeffrey Matthew\AppData\Local\npm-cache\_logs\2021-08-12T05_04_04_535Z-debug.log
Any solutions, please?

I think the reason is clear. Installed react version is 17.0.2 where as react-paystack 3.0.4 requires older version (16.x).
As current react-paystack only works on react 16.x, I think the only way is to create react project with 16.x version and try again.

You might have another node_modules folder or package.json file in a parent folder.

How can I download and Use Angular project off of Stackblitz?

So I have a project available on stackblitz that I want to use offline for my own purposes. for reference, here is the link to what I want to use- https://stackblitz.com/edit/nvs-angular-search-dropdown-istnzp. So, I tried to download the code and planned to run it using npm install and ng serve. but I am getting lots of errors on running npm install saying like this:
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: angular#0.0.0
npm ERR! Found: #angular/compiler#12.0.3
npm ERR! node_modules/#angular/compiler
npm ERR! #angular/compiler#"^12.0.3" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer #angular/compiler#"7.0.4" from #angular/compiler-cli#7.0.4
npm ERR! node_modules/#angular/compiler-cli
npm ERR! dev #angular/compiler-cli#"~7.0.0" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\cnaag\AppData\Local\npm-cache\eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\cnaag\AppData\Local\npm-cache\_logs\2021-06-06T10_39_43_617Z-debug.log
Any help in this regard would be amazing!

Instead of NPM, install Yarn on your machine and run yarn install