postcss 7.0.0 - 8.2.9 Severity: moderate Regular Expression Denial of Service

Question

When creating a new project under create-react-app, you get warnings straight away regarding a vulnerability found in postcss.

Issue reported by npm: https://www.npmjs.com/advisories/1693

Related open issues can be found here:

• https://github.com/postcss/postcss/issues/1574
• https://github.com/facebook/create-react-app/issues/10945

The issue has been patched on postcss v8.2.10, but it's still present when creating new projects as react-scripts hasn't upgraded the dependency yet.

So, my problem here is I can no longer run builds as they fail due to the vulnerability.

Since I can't wait for them to get it patched before to keep working on my stuff (they seem to be aware of it since a year ago), is there some workaround that could be applied to solve it?

I tried adding a postcss resolution on package.json:

  "resolutions": {
    "postcss": "^8.2.10"
  },

but that didn't land me far.

Any idea?

Counterattraction

I'm having the same issue. Doing a npm audit fix --force downgrades react-scripts resolving theses vulnerabilities but introducing yet more moderate and high vulnerabilities. – Graybeard

Answer 1

This article helped me. https://www.npmjs.com/package/npm-force-resolutions. To use resolutions you wrote you should force them by adding this script in package.json

"scripts": {
  "preinstall": "npx npm-force-resolutions"
}

after that run npm install and it should overwrite all nested dependencies

Anyway it will not work due many dependencies. Good news is that support for postcss 8 is already merged and probably will be released soon https://github.com/facebook/create-react-app/issues/9664

Colporteur

By deleting the node_modules and package-lock.json and following your suggestion, I managed to get it working with no vulnerabilities - only problem in forcing this resolution is you get an error when running npm audit fix due to the package tree being invalid - I guess we'll have to wait the patch, but at least this does temporarily, so thank you! – Counterattraction

Alternatively, you can use yarn which works with the resolutions in the package.json – Smallsword

Answer 2

Switching to Yarn makes this far simpler.

rm -rf ./node_modules 
rm ./package-lock.json

edit your package.json :
_{add any other package versions to upgrade from npm / yarn audit here also}

  "resolutions": 
  {
    "postcss": "^8.2.10"
  },

yarn install then running yarn audit should yield the magic words:

0 vulnerabilities found - Packages audited: 999
✨  Done in 1.10s.

Cattalo

Answer 3

I managed to reduce the audit issues down to one moderate vulnerability due to the browserslist package in my post here:

https://mcmap.net/q/830983/-moderate-severity-vulnerabilities-found-after-running-npx-create-react-app

Updating postcss to version 8.x.x in resolutions results in build issues for me. I'm a web dev newcomer and guessing version 8 breaking changes for plugins is the culprit. Version 7.0.36 is the latest version 7 postcss that builds and runs for me. The changelog states that this version has the ReDoS fix backported from version 8. I can't seem to solve the browserslist package issue without it causing 'module not found' errors at runtime. I'm guessing we'll have to wait on the CRA team to update react-scripts for a more thorough solution.

Bourgeois

Answer 4

Alternatively, you can solve it using yarn audit instead of npm.

yarn audit --groups postcss

This command will only ignore postcss package from the security check.

Lisalisabet