This is my first SO question, so apologies for the lengthy amount of code. I'm trying to start a new project with create-react-app. I ran the following command:
npx create-react-app jam-box --use-npm
because I want to use npm instead of yarn, and everything works, the project boilerplate is created. But there's a security vulnerability with one of the dependencies of react-scripts:
[Angie @ ~/jam-box](master)
$ npm audit
=== npm audit security report ===
┌──────────────────────────────────────────────────────────────────────────────┐
│ Manual Review │
│ Some vulnerabilities require your attention to resolve │
│ │
│ Visit https://go.npm.me/audit-guide for additional guidance │
└──────────────────────────────────────────────────────────────────────────────┘
┌───────────────┬──────────────────────────────────────────────────────────────┐
│ Low │ Prototype Pollution │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Package │ yargs-parser │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Patched in │ >=13.1.2 <14.0.0 || >=15.0.1 <16.0.0 || >=18.1.2 │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Dependency of │ react-scripts │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Path │ react-scripts > webpack-dev-server > yargs > yargs-parser │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ More info │ https://npmjs.com/advisories/1500 │
└───────────────┴──────────────────────────────────────────────────────────────┘
found 1 low severity vulnerability in 922235 scanned packages
1 vulnerability requires manual review. See the full report for details.
[Angie @ ~/jam-box](master)
$
I tried to run npm audit fix, but that didn't work. I went to both the webpack-dev-server github and the create-react-app github and it looked like they were already addressing this security issue, and as of two days ago, the issue was fixed and merged into the create-react-app master.
When running npm i react-scripts@latest inside my project:
[Angie @ ~/jam-box](master)
$ npm i react-scripts@latest
npm WARN deprecated [email protected]: fsevents 1 will break on node v14+ and could be using insecure binaries. Upgrade to fsevents 2.
npm WARN deprecated [email protected]: request has been deprecated, see https://github.com/request/request/issues/3142
npm WARN deprecated [email protected]: core-js@<3 is no longer maintained and not recommended for usage due to the number of issues. Please, upgrade your dependencies to the actual version of core-js@3.
npm WARN [email protected] requires a peer of node-sass@^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of sass@^1.3.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of fibers@>= 3.1.0 but none is installed. You must install peer dependencies yourself.
npm WARN [email protected] requires a peer of typescript@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta but none is installed. You must install peer dependencies yourself.
+ [email protected]
updated 1 package and audited 922235 packages in 46.013s
2 packages are looking for funding
run `npm fund` for details
found 1 low severity vulnerability
run `npm audit fix` to fix them, or `npm audit` for details
I was having this problem for days and was waiting to see if they would resolve it before trying to create a new create-react-app project. But today when I tried again to run npx create-react-app jam-box --use-npm, the security vulnerability was still there. I even tried running npm install react-scripts@latest and the vulnerability was still there. When I looked at my package-lock.json it says that react-scripts still was using the previous version of webpack-dev-server instead of the latest bump to 3.11.0. I don't know why when I run npx create-react-app that this isn't reflecting the latest master branch of create-react-app. I just want to run create-react-app to the latest version, any help would be appreciated.
npx create-react-app jam-box --use-npm
npx: installed 98 in 9.648s
Creating a new React app in /Users/Angie/jam-box.
Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts with cra-template...
> [email protected] install /Users/Angie/jam-box/node_modules/jest-haste-map/node_modules/fsevents
> node install.js
SOLINK_MODULE(target) Release/.node
CXX(target) Release/obj.target/fse/fsevents.o
SOLINK_MODULE(target) Release/fse.node
> [email protected] install /Users/Angie/jam-box/node_modules/watchpack/node_modules/fsevents
> node install.js
SOLINK_MODULE(target) Release/.node
CXX(target) Release/obj.target/fse/fsevents.o
SOLINK_MODULE(target) Release/fse.node
> [email protected] install /Users/Angie/jam-box/node_modules/webpack-dev-server/node_modules/fsevents
> node install.js
SOLINK_MODULE(target) Release/.node
CXX(target) Release/obj.target/fse/fsevents.o
SOLINK_MODULE(target) Release/fse.node
> [email protected] postinstall /Users/Angie/jam-box/node_modules/babel-runtime/node_modules/core-js
> node -e "try{require('./postinstall')}catch(e){}"
> [email protected] postinstall /Users/Angie/jam-box/node_modules/core-js
> node -e "try{require('./postinstall')}catch(e){}"
> [email protected] postinstall /Users/Angie/jam-box/node_modules/core-js-pure
> node -e "try{require('./postinstall')}catch(e){}"
+ [email protected]
+ [email protected]
+ [email protected]
+ [email protected]
added 1620 packages from 760 contributors and audited 922030 packages in 107.471s
59 packages are looking for funding
run `npm fund` for details
found 1 low severity vulnerability
run `npm audit fix` to fix them, or `npm audit` for details
Initialized a git repository.
Installing template dependencies using npm...
npm WARN [email protected] requires a peer of typescript@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta but none is installed. You must install peer dependencies yourself.
+ @testing-library/[email protected]
+ @testing-library/[email protected]
+ @testing-library/[email protected]
added 36 packages from 56 contributors and audited 922236 packages in 19.35s
59 packages are looking for funding
run `npm fund` for details
found 1 low severity vulnerability
run `npm audit fix` to fix them, or `npm audit` for details
Removing template package using npm...
npm WARN [email protected] requires a peer of typescript@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta but none is installed. You must install peer dependencies yourself.
removed 1 package and audited 922235 packages in 12.693s
59 packages are looking for funding
run `npm fund` for details
found 1 low severity vulnerability
run `npm audit fix` to fix them, or `npm audit` for details
Created git commit.
Success! Created jam-box at /Users/Angie/jam-box
Inside that directory, you can run several commands:
npm start
Starts the development server.
npm run build
Bundles the app into static files for production.
npm test
Starts the test runner.
npm run eject
Removes this tool and copies build dependencies, configuration files
and scripts into the app directory. If you do this, you can’t go back!
We suggest that you begin by typing:
cd jam-box
npm start
Happy hacking!
I've been chasing down this vulnerability hoping to fix it, too!
My understanding is that react-scripts hasn't updated their dependencies to point to webpack-dev-server 3.11.0. Since webpack-dev-server is a dependency of react-scripts, react-scripts needs to update this in their codebase. It's not something we can change in our dependencies.
As you pointed out, webpack-dev-server updated their dependency on yargs to deal with the "security vulnerability in yargs-parser (#2566) (41d1d0c)" (webpack-dev-server release notes: https://github.com/webpack/webpack-dev-server/releases).
But react-scripts (which is maintained and used by create-react-app https://github.com/facebook/create-react-app/tree/master/packages/react-scripts) has not yet updated their dependency on webpack-dev-server to use the new 3.11.0 version.
I think this can be brought up to them as a concern asking them to update their dependency on weback-dev-server to point to the newest one which will resolve a security vulnerability, but I am not sure how this is done exactly, to be honest.