Why is npm audit fix force not dealing with my react app vulnerabilities? - reactjs

I have been trying to create a react app using npx.
-At first it said " create-react-app " is no longer supported (problem solved I managed to generate an operating react app with a template).
-Then it started throwing warning (deprecated files) I managed to fix some of them but not all of them.
The app was created but with 6 high sevirity vulnerabilities.
I ran an audit fix --force it gave me 66 vulnerabilities. I ran the npm audit fix -force again it gave me the old 6 vulnerabilities.
My question is should I use the react app even with the high severity vulnerabilities or not use the react app because it will be used by my teammates as well.
Here is an overview in my terminal:
vulnerabilities

While those warnings can matter for front-end apps and I suggest to check if they affect you, they're mainly designed for Node.js apps.
In the meantime, the co-author of Redux and create-react-app, Dan Abramov, explained these warnings here: https://github.com/facebook/create-react-app/issues/11174
TLDR: npm audit is broken for front-end tooling by design
npm audit is designed for Node apps so it flags issues that can occur when you run actual Node code in production. That is categorically not how Create React App works.
But I still see these warnings when creating a new project or running npm install
Yes, unfortunately that's how npm works since v6. You can bring it up with npm. If enough people complain, maybe they'll rethink this decision. It is unfortunately actively hostile to build tooling.

Related

How to solve vulnerabilities in REACT JS

I am an absolute beginner in React N/JS. I have been learning from several videos and tried creating an app using the npx create-react-app *app name* . I made the same app before which was running fine, but I started over with the same app after a couple of months and the terminal showed 58 vulnerabilities (16 moderate, 40 high, 2 critical).
At first, I fixed it by running the command npm i --package-lock-only. but then something happened and i had to reinstall VS Code, after which the vulnerabilities reappeared and now neither npm audit fix or npm audit fix --force, nor npm i --package-lock-only is working.
As you can tell my technical terminologies are really weak, but I really hope I am making sense. Would really appreciate it if anyone could suggest me a solution!
it causes your node module's version different from your react version.
to be sure to see your recommended react version of the installed node module.

React/NPM dependecy error on create-react-app project

I am trying to create a new project and I am running into an npm security issue.
First I created a new react app using the command npx create-react-app {app-name} and then changed the directory into that folder. I tried to run npm install (to update all packages), and I get this error:
found 2 vulnerabilities (1 low, 1 high) in 1643 scanned packages
2 vulnerabilities require manual review. See the full report for details.
I ran npm audit as instructed and the generated security report shows the following:
NPM AUDIT SECURITY REPORT
at first I thought I had maybe done something incorrectly during the setup, however, I went to a previous project in which there were no dependency errors or errors at all for that matter. I ran npm install in the directory of the react app, and sure enough, I got the same issues. Obviously this is going to be a big deal if it is happening to everyone, but in the event that someone is not running into this issue, are the any tips I could get to overcome this error?
Thanks!

NPM or Yarn? What is the standard practice of starting React Native projects and managing packages?

When starting a new React Native project as below it's set up with yarn as it creates a yarn.lock file.
react-native init myProjectName
At the same time, many of the common libraries assume that that NPM is being used, like for example this one:
npm install --save react-native-navigation
Now having read many debates on this online (like this one), I gather that mixing the two is generally not a good idea, and the developer should stick to one of the other.
So... I decided to use NPM as that is something I am happy, familiar and comfortable with, and I haven't seen any delta which would justify switching to Yarn in my case. (Open to be convinced otherwise.)
My Question:
Would it be the best practice in my case is to start a project with react-native init myProjectName, and then manually tear out the yarn parts as for example described by this Stackoverflow answer? Or is there a better way of starting React Native projects using NPM?
Should I just use Yarn instead, and install everything with that, because that's just the "real" React Native way, or for any other reasons?
I am looking to find out what the best practice is and stick to it from now on. If possible, I'd rather not burn more gas thinking about package management in the future.
Each has their own respective benefits.
Yarn: Benefits
Considered faster than NPM
Easy to use/stable
Not too much of a departure from NPM
Yarn: Drawbacks
Doesn't work with node v5 or older.
Has had issues when installing/compiling native modules.
Though I believe there are more recent updates/workarounds.

Remove dependencies from package.json for React application

I am a developing a react ui, and i am having trouble eliminating some dependencies. These dependencies have security findings and I am not able to remove/eliminate from package.json. I tried npm uninstall but dosent seems to be solving the problem. The dependencies I wanted to eliminate are js-yaml, tough-cookie,http-proxy agent etc...
Please help... thanks in advance
If you're getting security warnings when creating a project with Create React App, you mostly likely aren't using the most recent version of Node and/or NPM.
I just reproduced the security warning problem when I started a project on Node v8.16. When I updated Node to the most recent version (v10.15.3 at the time of writing this), I no longer got any security warnings when starting a project.
Update Node and NPM to the most recent versions.
Removing the individual packages that are causing the security warnings for you is not an option since NPM doesn't have a dependency exclusion feature. All dependencies are installed for each package.

Another React Native version mismatch

I'm getting a React Native version mismatch.
JavaScript version: 0.51.0
Native version: 0.52.0
I know there are others who have posted similar online but I simply don't understand what I need to do to resolve it, and as I'm supposed to avoid asking for help in other posts I am starting a new one!
I've closed Terminals and run build again as suggested elsewhere, considered changing Expo versions but unsure if I need to, and how. Anyone got a simply-to-explain solution?
Which version of what do I need to change?
Thanks
The issue of mismatch is related to the changing of your react-native version without properly updating peer dependencies and native projects.
If your project is using Expo, try following the upgrade guidelines here offered from Facebook.
Upgrading to new React Native versions
Found under.. "Create React Native App projects"
The document reference in will give you working mappings.
Once updated, run in your project root.
npm prune && npm install
# OR
yarn
Afterward start your app with your cache cleared.
npm start --reset-cache
# or
yarn start --reset-cache

Resources