github Dependabot alert: Inefficient Regular Expression Complexity in nth-check

As Dan Abramov explains in this issue, it is (very likely) a false alarm and can be safely dismissed.

More specifically, if you are using CRA and nth-check is referenced only from it, it is not an issue, because CRA is a build tool and the vulnerable code will never get into the resulting application bundle and thus will never be called by client code.

You can verify this by moving "react-scripts" into "devDependencies" in package.json and running npm audit --production.

A few points before telling you the workaround:

1. It seems that the react-scripts vulnerability is a false alarm (as discussed here). Dan Abramov also wrote a fascinating in-depth blog post about how npm audit works and how it's somehow broken especially for front-end tooling by design.

2. Since react-scripts is essentially a build tool, even if the vulnerability was indeed genuine, it would be considered only a development issue since it'll be stripped from the production bundle anyway.

So if you do nothing about this so-called "vulnerability", nothing bad gonna happen and it's perfectly fine. But if the red alarm that a vulnerability exists is annoying you either aesthetically or is disrupting your CI/CD then read on.

Workaround:

The problem seems to be starting with the lib @svgr/webpack 4.0.0 - 5.0.0.

If you are using node version >= 16, you can install @svgr/webpack by yourself, in my case I installed the version: ^6.2.1 as devDependency.

After that, you should create a overrides (or resolutions if you are using yarn) section in your package.json and include the line: "@svgr/webpack": "$@svgr/webpack".

And last, you must remove your node_modules folder and your package-lock.json, and execute npm install.

Workaround credit.

I confirm it still works as of react-scripts 5.0.1 that you can move your version of react scripts from "dependencies" to "devDependencies" in package.json like this:

 "devDependencies": {
    "react-scripts": "^5.0.1"
  },

"devDependencies are packages that are consumed by requiring them in files or run as binaries, during the development phase. These are packages that are only necessary during development and not necessary for the production build."

Run "npm audit --production" to show that you do not need react-scripts at production.

Of course, if you still run into vulnerabilities, another package might have caused the vulnerability.

https://dev.to/moimikey/demystifying-devdependencies-and-dependencies-5ege

I also am on react-scripts@^5.0.0

So, I would personally recommend to use yarn first. But everybody has their own preferences! to do so, can type

npm install --global yarn

after that you could remove your package-lock file and run following command in the folder of your app of course

yarn

(such a surprise.) This will generate a yarn.lock file. Note that you should avoid using yarn and npm at the same time !

In that very same yarn.lock file, you will have to search for nth-check string! In a brand new react app (so far), you should find 8 occurrences of that string. This string will be set next to a package version. That's what you want to change.

In my case, I have for example

nth-check@^1.0.2: //so far. This version can be different for an older projet.
  version "1.0.2"
  resolved "https://registry.npmjs.org/nth-check/-/nth-check-1.0.2.tgz"

You want top change all those wrong versions. It should look like this :

nth-check@^2.0.1:
  version "2.0.1"
  resolved "https://registry.npmjs.org/nth-check/-/nth-check-2.0.1.tgz"

You will have to change a couple versions though. Not just one. I dit it (-6 times I believe. If you save the file, launche a simple

yarn

command followed by a

yarn audit

It SHOULD fix one of your problems!

Hope this was helpfull. Cheers!

Open package.json. You will find this:

"dependencies": {
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-scripts": "4.0.3"
  }

Take react-scripts and move it to devDependencies (if you don't have it, create it):

  "dependencies": {
    "react": "^17.0.2",
    "react-dom": "^17.0.2"
  },
  "devDependencies": {
    "react-scripts": "4.0.3"
  },

Then, ensure you run "npm audit --production"

This will fix your warnings.

If any of the above mentioned methods didn't work, then try this :

First check if the vulnerability is used in your code using the

npm-check

Now if the vulnerability module is not used in the code, then head-over to the 'package-lock.json' and search for the vulnerability path like

node_modules/svgo/node_modules/nth-check

and remove this dependency in the json file

Then run

npm audit

This will display

found 0 vulnerabilities

This mostly occurs when used

npx create-react-app "app"

and tried to install a module " React-Scripts"