Postcss dependency of react-scripts needs an upgrade #10945

nachogarciam · 2021-05-10T19:48:00Z

Hi team

My build is not passing because I'm using npm audit to detect vulnerabilities. Npm audit detected a vulnerability with postcss which is a dependency of react-scripts. https://www.npmjs.com/advisories/1693

I tried to update the dependency with npm install postcss but it didn't work.

What can I do?

Example of a vulnerability:

hammerdr · 2021-05-10T19:59:36Z

I'm also deep into trying to fix this and haven't yet found the resolution.

PostCSS refuses to release a security fix (postcss/postcss#1574), including declining to merge a PR to fix the security issue.
postcss-preset-env is a little under water trying to upgrade to PostCSS 8 (csstools/postcss-preset-env#191)

Trying to force a resolution gets me build errors.

hammerdr · 2021-05-10T20:35:56Z

This is not a recommendation, just saying how I'm working around this.

I forked the repository, applied the fix to the v7 branch, and created a release called v8.3.0 (from the v7 branch.. ugh) to get around the audit fix.

This is not verified, and not "safe", but because yarn audit doesn't have a way to ignore advisories I needed this as a way to get back to a green build.

Here is the release I created https://github.com/hammerdr/postcss/releases/tag/8.3.0

I then did

yarn add url.to.tar.gz
added "postcss": "url.to.tar.gz" to my resolutions in package.json

Will continue to watch this thread in case better solutions arise.

nachogarciam · 2021-05-10T20:59:15Z

Thank you for your quick response and for your work hammerdr. I’ll take a look.

Cheers!

kevlozano · 2021-05-11T16:13:22Z

I'm having the same issue. Upgrading or audit fix doesn't work.

sandeshindi · 2021-05-11T21:27:08Z

I m having the same issue. But workaround from hammerdr works. Any idea when they will be fixing the issue

Grachya · 2021-05-12T05:59:07Z

Have same issue. Waiting for fix.

hoffmannjan · 2021-05-12T08:16:53Z

Same here.

cinnamonbreakfast · 2021-05-12T08:39:04Z

Adding postcss to resolutions does not fix the issue either. Can't even compile by doing this. 😶

postcss-modules-values: postcss.plugin was deprecated. Migration guide:
https://evilmartians.com/chronicles/postcss-8-plugin-migration
postcss-modules-local-by-default: postcss.plugin was deprecated. Migration guide:
https://evilmartians.com/chronicles/postcss-8-plugin-migration
modules-extract-imports: postcss.plugin was deprecated. Migration guide:
https://evilmartians.com/chronicles/postcss-8-plugin-migration
postcss-modules-scope: postcss.plugin was deprecated. Migration guide:
https://evilmartians.com/chronicles/postcss-8-plugin-migration        
postcss-import-parser: postcss.plugin was deprecated. Migration guide:
https://evilmartians.com/chronicles/postcss-8-plugin-migration        
postcss-icss-parser: postcss.plugin was deprecated. Migration guide:  
https://evilmartians.com/chronicles/postcss-8-plugin-migration        
postcss-url-parser: postcss.plugin was deprecated. Migration guide:   
https://evilmartians.com/chronicles/postcss-8-plugin-migration        
postcss-flexbugs-fixes: postcss.plugin was deprecated. Migration guide:
https://evilmartians.com/chronicles/postcss-8-plugin-migration
autoprefixer: postcss.plugin was deprecated. Migration guide: 
https://evilmartians.com/chronicles/postcss-8-plugin-migration
postcss-attribute-case-insensitive: postcss.plugin was deprecated. Migration guide:
https://evilmartians.com/chronicles/postcss-8-plugin-migration
css-blank-pseudo: postcss.plugin was deprecated. Migration guide:
https://evilmartians.com/chronicles/postcss-8-plugin-migration   
postcss-color-functional-notation: postcss.plugin was deprecated. Migration guide:
https://evilmartians.com/chronicles/postcss-8-plugin-migration
postcss-color-gray: postcss.plugin was deprecated. Migration guide:
https://evilmartians.com/chronicles/postcss-8-plugin-migration
postcss-color-hex-alpha: postcss.plugin was deprecated. Migration guide:
https://evilmartians.com/chronicles/postcss-8-plugin-migration
postcss-color-mod-function: postcss.plugin was deprecated. Migration guide:
https://evilmartians.com/chronicles/postcss-8-plugin-migration
postcss-color-rebeccapurple: postcss.plugin was deprecated. Migration guide:
https://evilmartians.com/chronicles/postcss-8-plugin-migration
postcss-custom-media: postcss.plugin was deprecated. Migration guide:
https://evilmartians.com/chronicles/postcss-8-plugin-migration
postcss-custom-properties: postcss.plugin was deprecated. Migration guide:
https://evilmartians.com/chronicles/postcss-8-plugin-migration
postcss-custom-selectors: postcss.plugin was deprecated. Migration guide:
https://evilmartians.com/chronicles/postcss-8-plugin-migration
postcss-dir-pseudo-class: postcss.plugin was deprecated. Migration guide:
https://evilmartians.com/chronicles/postcss-8-plugin-migration
postcss-double-position-gradients: postcss.plugin was deprecated. Migration guide:
https://evilmartians.com/chronicles/postcss-8-plugin-migration
postcss-env-fn: postcss.plugin was deprecated. Migration guide:
https://evilmartians.com/chronicles/postcss-8-plugin-migration
postcss-focus-visible: postcss.plugin was deprecated. Migration guide:
https://evilmartians.com/chronicles/postcss-8-plugin-migration
postcss-focus-within: postcss.plugin was deprecated. Migration guide:
https://evilmartians.com/chronicles/postcss-8-plugin-migration
postcss-font-variant: postcss.plugin was deprecated. Migration guide:
https://evilmartians.com/chronicles/postcss-8-plugin-migration
postcss-gap-properties: postcss.plugin was deprecated. Migration guide:
https://evilmartians.com/chronicles/postcss-8-plugin-migration
css-has-pseudo: postcss.plugin was deprecated. Migration guide:
https://evilmartians.com/chronicles/postcss-8-plugin-migration
postcss-image-set-function: postcss.plugin was deprecated. Migration guide:
https://evilmartians.com/chronicles/postcss-8-plugin-migration
postcss-initial: postcss.plugin was deprecated. Migration guide:
https://evilmartians.com/chronicles/postcss-8-plugin-migration
postcss-lab-function: postcss.plugin was deprecated. Migration guide:
https://evilmartians.com/chronicles/postcss-8-plugin-migration
postcss-logical-properties: postcss.plugin was deprecated. Migration guide:
https://evilmartians.com/chronicles/postcss-8-plugin-migration

./src/index.css (./node_modules/css-loader/dist/cjs.js??ref--6-oneOf-3-1!./node_modules/postcss-loader/src??postcss!./src/index.css)
TypeError: Cannot read property 'unprefixed' of undefined

mrrotberry · 2021-05-12T09:09:39Z

Same here.👆☹️

a-dabrowski-atb · 2021-05-12T09:12:10Z

Same here ;o

cemysf · 2021-05-12T14:01:08Z

same here

Some remain but cannot right now be fixed; see facebook/create-react-app#10945 According to a comment by the author at postcss/postcss@8682b1e#commitcomment-49809613 the vulnerability only affects server-side parsing of CSS, so should not present a problem for us. Nonetheless, will check back in a week to see whether there's been any progress.

jerryhowe · 2021-05-17T14:30:12Z

my temporary solution to this is to explicitly set the npm audit threshold to high

npm audit --audit-level=high

Note: This does not really solve the root cause of the issue! It's simply to keep my CI/CD (Jenkins) happy until there is a proper fix to this!

mrrotberry · 2021-05-17T16:01:39Z

hmm, I will also offer my "temporary" solution for my CI/CD.

create npm script for audit in package.json "packages-audit": "yarn audit --groups dependencies";
move "react-scripts": "^4.0.3", to devDependencies section.

What we have, audit for all packages using in production build with default audit level and working CI/CD.

I really hope that soon the CRA team will find solutions for migrating the postcss library.

sricks · 2021-05-17T16:13:31Z

For anyone else that wants to patch this just for audit issues, see package audit-ci. It allows you to bypass certain advisories while keeping your audit level low.

Unfortunately it doesn't seem fully compatible with npm 7 yet: IBM/audit-ci#165

GD-Dheer · 2021-05-19T15:26:08Z

Also waiting for a fix on this. Thanks!

BiancaArtola · 2021-05-19T17:39:10Z

Same issue here

osmarbento-AWS · 2021-05-19T19:20:47Z

Same issue here

rakestto · 2021-05-20T11:13:06Z

I solved the problem temporarily with this library https://www.npmjs.com/package/npm-force-resolutions
and put postcss new version inside the resolutions key in package JSON.

Maybe isn't the best solution, I would like what do you think about it

jerryhowe · 2021-05-20T11:44:41Z

@rakestto I have already tried the force resolutions solution. However, I was unable to run npm build successfully after forcing the 8.2.10 dependency. Were you able to successfully build the project wit this? If so, how?

bholloway · 2021-05-20T12:06:42Z

With respect to resolve-url-loader there is bholloway/resolve-url-loader#198 relevant to this.

At least one user was successful with resolutions but I see from the comments above that might not work here.

Adopting postcss@8 in resolve-url-loader will force a major release (v5). There is an early alpha just published resolve-url-loader@next. The best way to help expedite this is to please try the alpha and upvote this comment 👍 .

rakestto · 2021-05-20T12:52:11Z

@rakestto I have already tried the force resolutions solution. However, I was unable to run npm build successfully after forcing the 8.2.10 dependency. Were you able to successfully build the project wit this? If so, how?

No, when I do a push my cypress tests fail on the GA. In my local machine it works perfect but in GA this solution make my tests fails.

jerryhowe · 2021-05-20T12:55:40Z

I suggest doing a fresh npm install (including deleting your node_modules first) on your local machine, then you will most likely get the same test errors in your local environment as well...

…

On Thu, 20 May 2021 at 14:52, Jose Fernando García Parreño < ***@***.***> wrote: @rakestto <https://github.com/rakestto> I have already tried the force resolutions solution. However, I was unable to run npm build successfully after forcing the 8.2.10 dependency. Were you able to successfully build the project wit this? If so, how? No, when I do a push my cypress tests fail on the GA. In my local machine it works perfect but with this solution tests fails. — You are receiving this because you commented. Reply to this email directly, view it on GitHub <#10945 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ABTWXORYCH7B4MVHAE5BDM3TOUAZDANCNFSM44SDC7XA> .

rakestto · 2021-05-20T13:30:38Z

I suggest doing a fresh npm install (including deleting your node_modules first) on your local machine, then you will most likely get the same test errors in your local environment as well...

I've some libraries that uses react-scripts too and have the same vulnerabilities and I solved it with the npm-force-resolutions too. If I delete node_modules and package.json in my main app (which uses the libraries) and run npm install, the console throw me an error saying that it can't install the library.

I don't know if I need to put the npm-force-resolution in the peerDeps key in the library and put it in the dependencies key in the main app. However, I've tried a lot of ways in order to solve it and I couldn't.

I think that the best option is keep waiting to an update for react-scripts.

jerryhowe · 2021-05-20T13:46:30Z

@rakestto you shouldn't delete your package.json, because you will not be able to run any scripts that way. If you want, you can delete your package-lock.json, but then you will need to remove "preinstall": "npx npm-force-resolutions" from your package.json file, otherwise you will not be able to run npm install without errors. I hope this helped your situation! :)

rakestto · 2021-05-20T13:57:02Z

@rakestto you shouldn't delete your package.json, because you will not be able to run any scripts that way. If you want, you can delete your package-lock.json, but then you will need to remove "preinstall": "npx npm-force-resolutions" from your package.json file, otherwise you will not be able to run npm install without errors. I hope this helped your situation! :)

Sorry I wanted to say package-lock, thank you :) I'll try it

bijoth · 2021-05-21T03:35:04Z

same issue

Hekmundo · 2021-05-21T19:41:25Z

Same issue here, waiting for fix. Thanks!

EduardoLopes · 2021-05-21T19:57:14Z

Anyone can confirm that upgrading node to version 16 can fix this?

I was having the same problem and after i've upgraded the node version of the CI to 16, this npm audit warning stopped showing.
It was using node 14, and i had some problems because of the package-lock file, since npm was upgraded from v6 to v7. To upgrade the package-lock properly, i did this:

delete the node_modules folder
delete package-lock
run npm install to generate a new package-lock

cinnamonbreakfast · 2021-05-22T14:44:15Z

^ doesn't really work if you have npm-force-resolutions

PtrJsn · 2021-05-23T03:24:39Z

In lieu of acknowledgement on this issue from the team & seeing the growing list of folks interested in this issue, I did find it's on the maintainers' radar: iansu/create-react-app-meta#56

Not sure what the timing of the fix is. Also, more discussion under #9664.

smparadeza · 2021-05-26T14:26:34Z

Same issue with mine. npm-force-resolution is causing problems with npm run build. Hoping for a fix.

iamarunkumark · 2021-05-27T10:03:48Z

I am also facing this issue.

jerryhowe · 2021-05-27T10:34:03Z

my current temporary solution for this is to move create-react-app to devDependencies like this:

npm i create-react-app -D

and then make sure my CI jobs run npm audit with --production flag like this:

npm audit --production

hope this helps!

anna-gladushko-hapara · 2021-05-27T23:25:55Z

yes, I also switched to npm audit --production, it's a shame we have do it though

isopen · 2021-05-29T17:57:04Z

Similarly:
Regular Expression Denial of Service - https://npmjs.com/advisories/1693

sricks · 2021-06-11T16:38:10Z

Really wishing that FB updates to postcss version 8, but there's now a backport to v7: postcss/postcss#1574 (comment)

So can we expect an update soon?

Gabe-MktShare · 2021-06-15T00:27:28Z

I used this from tailwind and it worked for me;
install the Tailwind CSS v2.0 PostCSS 7 compatibility build:
https://tailwindcss.com/docs/guides/create-react-app

PtrJsn · 2021-06-22T14:02:43Z

Update from a maintainer: #9664 (comment)

PR #11121 just got merged. Sounds like the fix will be in 4.1, & should be soon.

robertwt7 · 2021-06-29T00:24:35Z

Hopefully we get the next release soon.. its been 4 months since the last release guys :(

Vite js has been moving much faster

duongdev · 2021-06-29T04:12:24Z

@robertwt7 yeah I prefer vite to CRA for new projects. CRA seems so dead 😅

PtrJsn · 2021-06-29T04:31:08Z

Thanks for the tips about Vite! I've been looking for a CRA replacement due to the support experience.

cmacdonnacha · 2021-06-29T08:22:16Z

Vite is still very new, not sure I'd be using it in production apps for another while. It also treats Vue as a first class citizen.

imprfekt · 2021-06-29T15:18:07Z

Waiting for the 4.1
#9664 (comment)

gaearon · 2021-07-02T16:42:43Z

These warnings are false positives. There are no actual vulnerabilities affecting your app here.

To fix npm audit warnings, move react-scripts from dependencies to devDependencies in your package.json.

That will remove the false positive warnings.

I agree with the point in #11102 and will make this change so that new projects don't keep having these false positive warnings.

If you want to discuss this, please comment in #11102.

dezfowler mentioned this issue May 11, 2021

Advisory for v7 postcss/postcss#1574

Closed

hoffmannjan mentioned this issue May 12, 2021

Change storage of vault and salt casper-ecosystem/signer#57

Merged

kantuni mentioned this issue May 12, 2021

[Security] Upgrade postcss to 8.2.10 or later streamlit/streamlit#3251

Closed

macfarlandian mentioned this issue May 13, 2021

Resolve four active dependency vulnerabilities Recidiviz/public-dashboard#424

Closed

kpotter-m2 mentioned this issue May 14, 2021

Moderate vulnerabilities when running npx create-react-app #10929

Closed

This comment has been minimized.

Sign in to view

qdraw mentioned this issue May 20, 2021

PostCSS #10983

Open

ktrieu mentioned this issue May 22, 2021

Add image (and void block support) to the editor UWmathNEWS/slugline-web#84

Merged

indignant mentioned this issue Jun 3, 2021

audit failure 81 vulnerabilities found #11053

Closed

gaearon closed this as completed Jul 2, 2021

facebook locked as resolved and limited conversation to collaborators Jul 2, 2021

Postcss dependency of react-scripts needs an upgrade #10945

Postcss dependency of react-scripts needs an upgrade #10945

Comments

nachogarciam commented May 10, 2021 • edited Loading

hammerdr commented May 10, 2021 • edited Loading

hammerdr commented May 10, 2021 • edited Loading

nachogarciam commented May 10, 2021

kevlozano commented May 11, 2021

sandeshindi commented May 11, 2021

Grachya commented May 12, 2021

hoffmannjan commented May 12, 2021

cinnamonbreakfast commented May 12, 2021

mrrotberry commented May 12, 2021

a-dabrowski-atb commented May 12, 2021

cemysf commented May 12, 2021

jerryhowe commented May 17, 2021

mrrotberry commented May 17, 2021

sricks commented May 17, 2021

GD-Dheer commented May 19, 2021

This comment has been minimized.

BiancaArtola commented May 19, 2021

osmarbento-AWS commented May 19, 2021

rakestto commented May 20, 2021 • edited Loading

jerryhowe commented May 20, 2021

bholloway commented May 20, 2021 • edited Loading

rakestto commented May 20, 2021 • edited Loading

jerryhowe commented May 20, 2021 via email

rakestto commented May 20, 2021

jerryhowe commented May 20, 2021 • edited Loading

rakestto commented May 20, 2021 • edited Loading

bijoth commented May 21, 2021

Hekmundo commented May 21, 2021

EduardoLopes commented May 21, 2021

cinnamonbreakfast commented May 22, 2021

PtrJsn commented May 23, 2021

smparadeza commented May 26, 2021

iamarunkumark commented May 27, 2021

jerryhowe commented May 27, 2021

anna-gladushko-hapara commented May 27, 2021

isopen commented May 29, 2021

sricks commented Jun 11, 2021

Gabe-MktShare commented Jun 15, 2021 • edited Loading

PtrJsn commented Jun 22, 2021

robertwt7 commented Jun 29, 2021

duongdev commented Jun 29, 2021

PtrJsn commented Jun 29, 2021

cmacdonnacha commented Jun 29, 2021

imprfekt commented Jun 29, 2021

gaearon commented Jul 2, 2021

nachogarciam commented May 10, 2021 •

edited

Loading

hammerdr commented May 10, 2021 •

edited

Loading

hammerdr commented May 10, 2021 •

edited

Loading

rakestto commented May 20, 2021 •

edited

Loading

bholloway commented May 20, 2021 •

edited

Loading

rakestto commented May 20, 2021 •

edited

Loading

jerryhowe commented May 20, 2021 •

edited

Loading

rakestto commented May 20, 2021 •

edited

Loading

Gabe-MktShare commented Jun 15, 2021 •

edited

Loading