PostCSS dependency conflict in fresh CRA v5 + Storybook project following node_modules and package-lock.json removal

[pushred]

Describe the bug

As the repro demonstrates I have created a project using Create React App and Storybook init scripts, like so:

• npx create-react-app <name> --template typescript
• npx storybook init

The result works, until I reach a point in the project where I need to remove package-lock.json and node_modules in order to address some unrelated dependency issue. If I install dependencies from this point using the latest npm version v8.19.1 I am from thereon unable to build CRA production bundles due to this error:

> react-scripts build

Creating an optimized production build...
Failed to compile.

static/css/main.a6b5f62b.css from Css Minimizer plugin
Error: PostCSS plugin postcss-discard-comments requires PostCSS 8.
Migration guide for end-users:
https://github.com/postcss/postcss/wiki/PostCSS-8-for-end-users

Running npm ls postcss I see that the dependency graph is in a terrible state:

Tons of dependency errors

├─┬ @storybook/builder-webpack5@6.5.12
│ └─┬ css-loader@5.2.7
│   ├─┬ icss-utils@5.1.0
│   │ └── postcss@7.0.39 deduped invalid: ">= 8" from node_modules/postcss-normalize, "^8.2" from node_modules/postcss-preset-env, "^8.1.0" from node_modules/icss-utils
│   ├─┬ postcss-modules-extract-imports@3.0.0
│   │ └── postcss@7.0.39 deduped invalid: ">= 8" from node_modules/postcss-normalize, "^8.2" from node_modules/postcss-preset-env, "^8.1.0" from node_modules/icss-utils, "^8.1.0" from node_modules/postcss-modules-extract-imports

··· truncated, repeated errors exceed GitHub comment length max ···

│   ├─┬ postcss-modules-values@4.0.0
│   │ └── postcss@7.0.39 deduped invalid: ">= 8" from node_modules/postcss-normalize, "^8.2" from node_modules/postcss-preset-env, "^8.1.0" from node_modules/icss-utils, "^8.1.0" from node_modules/postcss-modules-extract-imports, "^8.1.0" from node_modules/postcss-modules-local-by-default, "^8.1.0" from node_modules/postcss-modules-scope, "^8.1.0" from node_modules/postcss-modules-values
│   └── postcss@8.4.16
├─┬ @storybook/react@6.5.12
│ └─┬ @storybook/core@6.5.12
│   └─┬ @storybook/core-server@6.5.12
│     ├─┬ @storybook/builder-webpack4@6.5.12
│     │ ├─┬ autoprefixer@9.8.8
│     │ │ └── postcss@7.0.39 deduped invalid: ">= 8" from node_modules/postcss-normalize, "^8.2" from node_modules/postcss-preset-env, "^8.1.0" from node_modules/icss-utils, "^8.1.0" from node_modules/postcss-modules-extract-imports, "^8.1.0" from node_modules/postcss-modules-local-by-default, "^8.1.0" from node_modules/postcss-modules-scope, "^8.1.0" from node_modules/postcss-modules-values, "^8.2.15" from node_modules/cssnano, ">=8" from node_modules/postcss-browser-comments, "^8.2" from node_modules/@csstools/postcss-cascade-layers, "^8.2" from node_modules/@csstools/postcss-color-function, "^8.2" from node_modules/@csstools/postcss-font-format-keywords, "^8.2" from node_modules/@csstools/postcss-hwb-function, "^8.2" from node_modules/@csstools/postcss-ic-unit, "^8.2" from node_modules/@csstools/postcss-is-pseudo-class, "^8.2" from node_modules/@csstools/postcss-nested-calc, "^8.2" from node_modules/@csstools/postcss-normalize-display-values, "^8.2" from node_modules/@csstools/postcss-oklab-function, "^8.3" from node_modules/@csstools/postcss-progressive-custom-properties, "^8.2" from node_modules/@csstools/postcss-stepped-value-functions, "^8.2" from node_modules/@csstools/postcss-text-decoration-shorthand, "^8.2" from node_modules/@csstools/postcss-trigonometric-functions, "^8.2" from node_modules/@csstools/postcss-unset-value, "^8.1.0" from node_modules/postcss-preset-env/node_modules/autoprefixer, "^8.4" from node_modules/css-blank-pseudo, "^8.4" from node_modules/css-has-pseudo, "^8.4" from node_modules/css-prefers-color-scheme, "^8.2" from node_modules/postcss-attribute-case-insensitive, "^8.4.6" from node_modules/postcss-clamp, "^8.2" from node_modules/postcss-color-functional-notation, "^8.4" from node_modules/postcss-color-hex-alpha, "^8.2" from node_modules/postcss-color-rebeccapurple, "^8.3" from node_modules/postcss-custom-media, "^8.2" from node_modules/postcss-custom-properties, "^8.3" from node_modules/postcss-custom-selectors, "^8.2" from node_modules/postcss-dir-pseudo-class, "^8.2" from node_modules/postcss-double-position-gradients, "^8.4" from node_modules/postcss-env-function, "^8.4" from node_modules/postcss-focus-visible, "^8.4" from node_modules/postcss-focus-within, "^8.1.0" from node_modules/postcss-font-variant, "^8.2" from node_modules/postcss-gap-properties, "^8.2" from node_modules/postcss-image-set-function, "^8.0.0" from node_modules/postcss-initial, "^8.2" from node_modules/postcss-lab-function, "^8.4" from node_modules/postcss-logical, "^8.1.0" from node_modules/postcss-media-minmax, "^8.2" from node_modules/postcss-nesting, "^8.2" from node_modules/postcss-overflow-shorthand, "^8" from node_modules/postcss-page-break, "^8.2" from node_modules/postcss-place, "^8.2" from node_modules/postcss-pseudo-class-any-link, "^8.0.3" from node_modules/postcss-replace-overflow-wrap, "^8.2" from node_modules/postcss-selector-not, "^8.0.0" from node_modules/postcss-import, "^8.3.3" from node_modules/postcss-js, ">=8.0.9" from node_modules/postcss-load-config, "^8.2.14" from node_modules/postcss-nested, "^8.2.15" from node_modules/cssnano-preset-default, "^8.2" from node_modules/@csstools/selector-specificity
│     │ ├─┬ css-loader@3.6.0
│     │ │ ├─┬ icss-utils@4.1.1
│     │ │ │ └── postcss@7.0.39 deduped invalid: ">= 8" from node_modules/postcss-normalize, "^8.2" from node_modules/postcss-preset-env, "^8.1.0" from node_modules/icss-utils, "^8.1.0" from node_modules/postcss-modules-extract-imports, "^8.1.0" from node_modules/postcss-modules-local-by-default, "^8.1.0" from node_modules/postcss-modules-scope, "^8.1.0" from node_modules/postcss-modules-values, "^8.2.15" from node_modules/cssnano, ">=8" from node_modules/postcss-browser-comments, "^8.2" from node_modules/@csstools/postcss-cascade-layers, "^8.2" from node_modules/@csstools/postcss-color-function, "^8.2" from node_modules/@csstools/postcss-font-format-keywords, "^8.2" from node_modules/@csstools/postcss-hwb-function, "^8.2" from node_modules/@csstools/postcss-ic-unit, "^8.2" from node_modules/@csstools/postcss-is-pseudo-class, "^8.2" from node_modules/@csstools/postcss-nested-calc, "^8.2" from node_modules/@csstools/postcss-normalize-display-values, "^8.2" from node_modules/@csstools/postcss-oklab-function, "^8.3" from node_modules/@csstools/postcss-progressive-custom-properties, "^8.2" from node_modules/@csstools/postcss-stepped-value-functions, "^8.2" from node_modules/@csstools/postcss-text-decoration-shorthand, "^8.2" from node_modules/@csstools/postcss-trigonometric-functions, "^8.2" from node_modules/@csstools/postcss-unset-value, "^8.1.0" from node_modules/postcss-preset-env/node_modules/autoprefixer, "^8.4" from node_modules/css-blank-pseudo, "^8.4" from node_modules/css-has-pseudo, "^8.4" from node_modules/css-prefers-color-scheme, "^8.2" from node_modules/postcss-attribute-case-insensitive, "^8.4.6" from node_modules/postcss-clamp, "^8.2" from node_modules/postcss-color-functional-notation, "^8.4" from node_modules/postcss-color-hex-alpha, "^8.2" from node_modules/postcss-color-rebeccapurple, "^8.3" from node_modules/postcss-custom-media, "^8.2" from node_modules/postcss-custom-properties, "^8.3" from node_modules/postcss-custom-selectors, "^8.2" from node_modules/postcss-dir-pseudo-class, "^8.2" from node_modules/postcss-double-position-gradients, "^8.4" from node_modules/postcss-env-function, "^8.4" from node_modules/postcss-focus-visible, "^8.4" from node_modules/postcss-focus-within, "^8.1.0" from node_modules/postcss-font-variant, "^8.2" from node_modules/postcss-gap-properties, "^8.2" from node_modules/postcss-image-set-function, "^8.0.0" from node_modules/postcss-initial, "^8.2" from node_modules/postcss-lab-function, "^8.4" from node_modules/postcss-logical, "^8.1.0" from node_modules/postcss-media-minmax, "^8.2" from node_modules/postcss-nesting, "^8.2" from node_modules/postcss-overflow-shorthand, "^8" from node_modules/postcss-page-break, "^8.2" from node_modules/postcss-place, "^8.2" from node_modules/postcss-pseudo-class-any-link, "^8.0.3" from node_modules/postcss-replace-overflow-wrap, "^8.2" from node_modules/postcss-selector-not, "^8.0.0" from node_modules/postcss-import, "^8.3.3" from node_modules/postcss-js, ">=8.0.9" from node_modules/postcss-load-config, "^8.2.14" from node_modules/postcss-nested, "^8.2.15" from node_modules/cssnano-preset-default, "^8.2" from node_modules/@csstools/selector-specificity, "^8.0.9" from node_modules/css-declaration-sorter, "^8.2.15" from node_modules/cssnano-utils, "^8.2.2" from node_modules/postcss-calc, "^8.2.15" from node_modules/postcss-colormin, "^8.2.15" from node_modules/postcss-convert-values, "^8.2.15" from node_modules/postcss-discard-comments, "^8.2.15" from node_modules/postcss-discard-duplicates, "^8.2.15" from node_modules/postcss-discard-empty, "^8.2.15" from node_modules/postcss-discard-overridden, "^8.2.15" from node_modules/postcss-merge-longhand, "^8.2.15" from node_modules/postcss-merge-rules, "^8.2.15" from node_modules/postcss-minify-font-values, "^8.2.15" from node_modules/postcss-minify-gradients, "^8.2.15" from node_modules/postcss-minify-params, "^8.2.15" from node_modules/postcss-minify-selectors, "^8.2.15" from node_modules/postcss-normalize-charset, "^8.2.15" from node_modules/postcss-normalize-display-values, "^8.2.15" from node_modules/postcss-normalize-positions, "^8.2.15" from node_modules/postcss-normalize-repeat-style, "^8.2.15" from node_modules/postcss-normalize-string, "^8.2.15" from node_modules/postcss-normalize-timing-functions, "^8.2.15" from node_modules/postcss-normalize-unicode, "^8.2.15" from node_modules/postcss-normalize-url, "^8.2.15" from node_modules/postcss-normalize-whitespace, "^8.2.15" from node_modules/postcss-ordered-values, "^8.2.15" from node_modules/postcss-reduce-initial, "^8.2.15" from node_modules/postcss-reduce-transforms, "^8.2.15" from node_modules/postcss-svgo, "^8.2.15" from node_modules/postcss-unique-selectors
│     │ │ ├─┬ postcss-modules-extract-imports@2.0.0
│     │ │ │ └── postcss@7.0.39 deduped invalid: ">= 8" from node_modules/postcss-normalize, "^8.2" from node_modules/postcss-preset-env, "^8.1.0" from node_modules/icss-utils, "^8.1.0" from node_modules/postcss-modules-extract-imports, "^8.1.0" from node_modules/postcss-modules-local-by-default, "^8.1.0" from node_modules/postcss-modules-scope, "^8.1.0" from node_modules/postcss-modules-values, "^8.2.15" from node_modules/cssnano, ">=8" from node_modules/postcss-browser-comments, "^8.2" from node_modules/@csstools/postcss-cascade-layers, "^8.2" from node_modules/@csstools/postcss-color-function, "^8.2" from node_modules/@csstools/postcss-font-format-keywords, "^8.2" from node_modules/@csstools/postcss-hwb-function, "^8.2" from node_modules/@csstools/postcss-ic-unit, "^8.2" from node_modules/@csstools/postcss-is-pseudo-class, "^8.2" from node_modules/@csstools/postcss-nested-calc, "^8.2" from node_modules/@csstools/postcss-normalize-display-values, "^8.2" from node_modules/@csstools/postcss-oklab-function, "^8.3" from node_modules/@csstools/postcss-progressive-custom-properties, "^8.2" from node_modules/@csstools/postcss-stepped-value-functions, "^8.2" from node_modules/@csstools/postcss-text-decoration-shorthand, "^8.2" from node_modules/@csstools/postcss-trigonometric-functions, "^8.2" from node_modules/@csstools/postcss-unset-value, "^8.1.0" from node_modules/postcss-preset-env/node_modules/autoprefixer, "^8.4" from node_modules/css-blank-pseudo, "^8.4" from node_modules/css-has-pseudo, "^8.4" from node_modules/css-prefers-color-scheme, "^8.2" from node_modules/postcss-attribute-case-insensitive, "^8.4.6" from node_modules/postcss-clamp, "^8.2" from node_modules/postcss-color-functional-notation, "^8.4" from node_modules/postcss-color-hex-alpha, "^8.2" from node_modules/postcss-color-rebeccapurple, "^8.3" from node_modules/postcss-custom-media, "^8.2" from node_modules/postcss-custom-properties, "^8.3" from node_modules/postcss-custom-selectors, "^8.2" from node_modules/postcss-dir-pseudo-class, "^8.2" from node_modules/postcss-double-position-gradients, "^8.4" from node_modules/postcss-env-function, "^8.4" from node_modules/postcss-focus-visible, "^8.4" from node_modules/postcss-focus-within, "^8.1.0" from node_modules/postcss-font-variant, "^8.2" from node_modules/postcss-gap-properties, "^8.2" from node_modules/postcss-image-set-function, "^8.0.0" from node_modules/postcss-initial, "^8.2" from node_modules/postcss-lab-function, "^8.4" from node_modules/postcss-logical, "^8.1.0" from node_modules/postcss-media-minmax, "^8.2" from node_modules/postcss-nesting, "^8.2" from node_modules/postcss-overflow-shorthand, "^8" from node_modules/postcss-page-break, "^8.2" from node_modules/postcss-place, "^8.2" from node_modules/postcss-pseudo-class-any-link, "^8.0.3" from node_modules/postcss-replace-overflow-wrap, "^8.2" from node_modules/postcss-selector-not, "^8.0.0" from node_modules/postcss-import, "^8.3.3" from node_modules/postcss-js, ">=8.0.9" from node_modules/postcss-load-config, "^8.2.14" from node_modules/postcss-nested, "^8.2.15" from node_modules/cssnano-preset-default, "^8.2" from node_modules/@csstools/selector-specificity, "^8.0.9" from node_modules/css-declaration-sorter, "^8.2.15" from node_modules/cssnano-utils, "^8.2.2" from node_modules/postcss-calc, "^8.2.15" from node_modules/postcss-colormin, "^8.2.15" from node_modules/postcss-convert-values, "^8.2.15" from node_modules/postcss-discard-comments, "^8.2.15" from node_modules/postcss-discard-duplicates, "^8.2.15" from node_modules/postcss-discard-empty, "^8.2.15" from node_modules/postcss-discard-overridden, "^8.2.15" from node_modules/postcss-merge-longhand, "^8.2.15" from node_modules/postcss-merge-rules, "^8.2.15" from node_modules/postcss-minify-font-values, "^8.2.15" from node_modules/postcss-minify-gradients, "^8.2.15" from node_modules/postcss-minify-params, "^8.2.15" from node_modules/postcss-minify-selectors, "^8.2.15" from node_modules/postcss-normalize-charset, "^8.2.15" from node_modules/postcss-normalize-display-values, "^8.2.15" from node_modules/postcss-normalize-positions, "^8.2.15" from node_modules/postcss-normalize-repeat-style, "^8.2.15" from node_modules/postcss-normalize-string, "^8.2.15" from node_modules/postcss-normalize-timing-functions, "^8.2.15" from node_modules/postcss-normalize-unicode, "^8.2.15" from node_modules/postcss-normalize-url, "^8.2.15" from node_modules/postcss-normalize-whitespace, "^8.2.15" from node_modules/postcss-ordered-values, "^8.2.15" from node_modules/postcss-reduce-initial, "^8.2.15" from node_modules/postcss-reduce-transforms, "^8.2.15" from node_modules/postcss-svgo, "^8.2.15" from node_modules/postcss-unique-selectors

··· truncated, repeated errors exceed GitHub comment length max ···

│     │ ├─┬ postcss-loader@4.3.0
│     │ │ └── postcss@7.0.39 deduped invalid: ">= 8" from node_modules/postcss-normalize, "^8.2" from node_modules/postcss-preset-env, "^8.1.0" from node_modules/icss-utils, "^8.1.0" from node_modules/postcss-modules-extract-imports, "^8.1.0" from node_modules/postcss-modules-local-by-default, "^8.1.0" from node_modules/postcss-modules-scope, "^8.1.0" from node_modules/postcss-modules-values, "^8.2.15" from node_modules/cssnano, ">=8" from node_modules/postcss-browser-comments, "^8.2" from node_modules/@csstools/postcss-cascade-layers, "^8.2" from node_modules/@csstools/postcss-color-function, "^8.2" from node_modules/@csstools/postcss-font-format-keywords, "^8.2" from node_modules/@csstools/postcss-hwb-function, "^8.2" from node_modules/@csstools/postcss-ic-unit, "^8.2" from node_modules/@csstools/postcss-is-pseudo-class, "^8.2" from node_modules/@csstools/postcss-nested-calc, "^8.2" from node_modules/@csstools/postcss-normalize-display-values, "^8.2" from node_modules/@csstools/postcss-oklab-function, "^8.3" from node_modules/@csstools/postcss-progressive-custom-properties, "^8.2" from node_modules/@csstools/postcss-stepped-value-functions, "^8.2" from node_modules/@csstools/postcss-text-decoration-shorthand, "^8.2" from node_modules/@csstools/postcss-trigonometric-functions, "^8.2" from node_modules/@csstools/postcss-unset-value, "^8.1.0" from node_modules/postcss-preset-env/node_modules/autoprefixer, "^8.4" from node_modules/css-blank-pseudo, "^8.4" from node_modules/css-has-pseudo, "^8.4" from node_modules/css-prefers-color-scheme, "^8.2" from node_modules/postcss-attribute-case-insensitive, "^8.4.6" from node_modules/postcss-clamp, "^8.2" from node_modules/postcss-color-functional-notation, "^8.4" from node_modules/postcss-color-hex-alpha, "^8.2" from node_modules/postcss-color-rebeccapurple, "^8.3" from node_modules/postcss-custom-media, "^8.2" from node_modules/postcss-custom-properties, "^8.3" from node_modules/postcss-custom-selectors, "^8.2" from node_modules/postcss-dir-pseudo-class, "^8.2" from node_modules/postcss-double-position-gradients, "^8.4" from node_modules/postcss-env-function, "^8.4" from node_modules/postcss-focus-visible, "^8.4" from node_modules/postcss-focus-within, "^8.1.0" from node_modules/postcss-font-variant, "^8.2" from node_modules/postcss-gap-properties, "^8.2" from node_modules/postcss-image-set-function, "^8.0.0" from node_modules/postcss-initial, "^8.2" from node_modules/postcss-lab-function, "^8.4" from node_modules/postcss-logical, "^8.1.0" from node_modules/postcss-media-minmax, "^8.2" from node_modules/postcss-nesting, "^8.2" from node_modules/postcss-overflow-shorthand, "^8" from node_modules/postcss-page-break, "^8.2" from node_modules/postcss-place, "^8.2" from node_modules/postcss-pseudo-class-any-link, "^8.0.3" from node_modules/postcss-replace-overflow-wrap, "^8.2" from node_modules/postcss-selector-not, "^8.0.0" from node_modules/postcss-import, "^8.3.3" from node_modules/postcss-js, ">=8.0.9" from node_modules/postcss-load-config, "^8.2.14" from node_modules/postcss-nested, "^8.2.15" from node_modules/cssnano-preset-default, "^8.2" from node_modules/@csstools/selector-specificity
│     │ └── postcss@7.0.39 deduped invalid: ">= 8" from node_modules/postcss-normalize, "^8.2" from node_modules/postcss-preset-env, "^8.1.0" from node_modules/icss-utils, "^8.1.0" from node_modules/postcss-modules-extract-imports, "^8.1.0" from node_modules/postcss-modules-local-by-default, "^8.1.0" from node_modules/postcss-modules-scope, "^8.1.0" from node_modules/postcss-modules-values, "^8.2.15" from node_modules/cssnano, ">=8" from node_modules/postcss-browser-comments, "^8.2" from node_modules/@csstools/postcss-cascade-layers, "^8.2" from node_modules/@csstools/postcss-color-function, "^8.2" from node_modules/@csstools/postcss-font-format-keywords, "^8.2" from node_modules/@csstools/postcss-hwb-function, "^8.2" from node_modules/@csstools/postcss-ic-unit, "^8.2" from node_modules/@csstools/postcss-is-pseudo-class, "^8.2" from node_modules/@csstools/postcss-nested-calc, "^8.2" from node_modules/@csstools/postcss-normalize-display-values, "^8.2" from node_modules/@csstools/postcss-oklab-function, "^8.3" from node_modules/@csstools/postcss-progressive-custom-properties, "^8.2" from node_modules/@csstools/postcss-stepped-value-functions, "^8.2" from node_modules/@csstools/postcss-text-decoration-shorthand, "^8.2" from node_modules/@csstools/postcss-trigonometric-functions, "^8.2" from node_modules/@csstools/postcss-unset-value, "^8.1.0" from node_modules/postcss-preset-env/node_modules/autoprefixer, "^8.4" from node_modules/css-blank-pseudo, "^8.4" from node_modules/css-has-pseudo, "^8.4" from node_modules/css-prefers-color-scheme, "^8.2" from node_modules/postcss-attribute-case-insensitive, "^8.4.6" from node_modules/postcss-clamp, "^8.2" from node_modules/postcss-color-functional-notation, "^8.4" from node_modules/postcss-color-hex-alpha, "^8.2" from node_modules/postcss-color-rebeccapurple, "^8.3" from node_modules/postcss-custom-media, "^8.2" from node_modules/postcss-custom-properties, "^8.3" from node_modules/postcss-custom-selectors, "^8.2" from node_modules/postcss-dir-pseudo-class, "^8.2" from node_modules/postcss-double-position-gradients, "^8.4" from node_modules/postcss-env-function, "^8.4" from node_modules/postcss-focus-visible, "^8.4" from node_modules/postcss-focus-within, "^8.1.0" from node_modules/postcss-font-variant, "^8.2" from node_modules/postcss-gap-properties, "^8.2" from node_modules/postcss-image-set-function, "^8.0.0" from node_modules/postcss-initial, "^8.2" from node_modules/postcss-lab-function, "^8.4" from node_modules/postcss-logical, "^8.1.0" from node_modules/postcss-media-minmax, "^8.2" from node_modules/postcss-nesting, "^8.2" from node_modules/postcss-overflow-shorthand, "^8" from node_modules/postcss-page-break, "^8.2" from node_modules/postcss-place, "^8.2" from node_modules/postcss-pseudo-class-any-link, "^8.0.3" from node_modules/postcss-replace-overflow-wrap, "^8.2" from node_modules/postcss-selector-not, "^8.0.0" from node_modules/postcss-import, "^8.3.3" from node_modules/postcss-js, ">=8.0.9" from node_modules/postcss-load-config, "^8.2.14" from node_modules/postcss-nested
│     └─┬ @storybook/manager-webpack4@6.5.12
│       └─┬ css-loader@3.6.0
│         ├─┬ icss-utils@4.1.1
│         │ └── postcss@7.0.39 deduped invalid: ">= 8" from node_modules/postcss-normalize, "^8.2" from node_modules/postcss-preset-env, "^8.1.0" from node_modules/icss-utils, "^8.1.0" from node_modules/postcss-modules-extract-imports, "^8.1.0" from node_modules/postcss-modules-local-by-default, "^8.1.0" from node_modules/postcss-modules-scope, "^8.1.0" from node_modules/postcss-modules-values, "^8.2.15" from node_modules/cssnano, ">=8" from node_modules/postcss-browser-comments, "^8.2" from node_modules/@csstools/postcss-cascade-layers, "^8.2" from node_modules/@csstools/postcss-color-function, "^8.2" from node_modules/@csstools/postcss-font-format-keywords, "^8.2" from node_modules/@csstools/postcss-hwb-function, "^8.2" from node_modules/@csstools/postcss-ic-unit, "^8.2" from node_modules/@csstools/postcss-is-pseudo-class, "^8.2" from node_modules/@csstools/postcss-nested-calc, "^8.2" from node_modules/@csstools/postcss-normalize-display-values, "^8.2" from node_modules/@csstools/postcss-oklab-function, "^8.3" from node_modules/@csstools/postcss-progressive-custom-properties, "^8.2" from node_modules/@csstools/postcss-stepped-value-functions, "^8.2" from node_modules/@csstools/postcss-text-decoration-shorthand, "^8.2" from node_modules/@csstools/postcss-trigonometric-functions, "^8.2" from node_modules/@csstools/postcss-unset-value, "^8.1.0" from node_modules/postcss-preset-env/node_modules/autoprefixer, "^8.4" from node_modules/css-blank-pseudo, "^8.4" from node_modules/css-has-pseudo, "^8.4" from node_modules/css-prefers-color-scheme, "^8.2" from node_modules/postcss-attribute-case-insensitive, "^8.4.6" from node_modules/postcss-clamp, "^8.2" from node_modules/postcss-color-functional-notation, "^8.4" from node_modules/postcss-color-hex-alpha, "^8.2" from node_modules/postcss-color-rebeccapurple, "^8.3" from node_modules/postcss-custom-media, "^8.2" from node_modules/postcss-custom-properties, "^8.3" from node_modules/postcss-custom-selectors, "^8.2" from node_modules/postcss-dir-pseudo-class, "^8.2" from node_modules/postcss-double-position-gradients, "^8.4" from node_modules/postcss-env-function, "^8.4" from node_modules/postcss-focus-visible, "^8.4" from node_modules/postcss-focus-within, "^8.1.0" from node_modules/postcss-font-variant, "^8.2" from node_modules/postcss-gap-properties, "^8.2" from node_modules/postcss-image-set-function, "^8.0.0" from node_modules/postcss-initial, "^8.2" from node_modules/postcss-lab-function, "^8.4" from node_modules/postcss-logical, "^8.1.0" from node_modules/postcss-media-minmax, "^8.2" from node_modules/postcss-nesting, "^8.2" from node_modules/postcss-overflow-shorthand, "^8" from node_modules/postcss-page-break, "^8.2" from node_modules/postcss-place, "^8.2" from node_modules/postcss-pseudo-class-any-link, "^8.0.3" from node_modules/postcss-replace-overflow-wrap, "^8.2" from node_modules/postcss-selector-not, "^8.0.0" from node_modules/postcss-import, "^8.3.3" from node_modules/postcss-js, ">=8.0.9" from node_modules/postcss-load-config, "^8.2.14" from node_modules/postcss-nested, "^8.2.15" from node_modules/cssnano-preset-default, "^8.2" from node_modules/@csstools/selector-specificity, "^8.0.9" from node_modules/css-declaration-sorter, "^8.2.15" from node_modules/cssnano-utils, "^8.2.2" from node_modules/postcss-calc, "^8.2.15" from node_modules/postcss-colormin, "^8.2.15" from node_modules/postcss-convert-values, "^8.2.15" from node_modules/postcss-discard-comments, "^8.2.15" from node_modules/postcss-discard-duplicates, "^8.2.15" from node_modules/postcss-discard-empty, "^8.2.15" from node_modules/postcss-discard-overridden, "^8.2.15" from node_modules/postcss-merge-longhand, "^8.2.15" from node_modules/postcss-merge-rules, "^8.2.15" from node_modules/postcss-minify-font-values, "^8.2.15" from node_modules/postcss-minify-gradients, "^8.2.15" from node_modules/postcss-minify-params, "^8.2.15" from node_modules/postcss-minify-selectors, "^8.2.15" from node_modules/postcss-normalize-charset, "^8.2.15" from node_modules/postcss-normalize-display-values, "^8.2.15" from node_modules/postcss-normalize-positions, "^8.2.15" from node_modules/postcss-normalize-repeat-style, "^8.2.15" from node_modules/postcss-normalize-string, "^8.2.15" from node_modules/postcss-normalize-timing-functions, "^8.2.15" from node_modules/postcss-normalize-unicode, "^8.2.15" from node_modules/postcss-normalize-url, "^8.2.15" from node_modules/postcss-normalize-whitespace, "^8.2.15" from node_modules/postcss-ordered-values, "^8.2.15" from node_modules/postcss-reduce-initial, "^8.2.15" from node_modules/postcss-reduce-transforms, "^8.2.15" from node_modules/postcss-svgo, "^8.2.15" from node_modules/postcss-unique-selectors
│         ├─┬ postcss-modules-extract-imports@2.0.0
│         │ └── postcss@7.0.39 deduped invalid: ">= 8" from node_modules/postcss-normalize, "^8.2" from node_modules/postcss-preset-env, "^8.1.0" from node_modules/icss-utils, "^8.1.0" from node_modules/postcss-modules-extract-imports, "^8.1.0" from node_modules/postcss-modules-local-by-default, "^8.1.0" from node_modules/postcss-modules-scope, "^8.1.0" from node_modules/postcss-modules-values, "^8.2.15" from node_modules/cssnano, ">=8" from node_modules/postcss-browser-comments, "^8.2" from node_modules/@csstools/postcss-cascade-layers, "^8.2" from node_modules/@csstools/postcss-color-function, "^8.2" from node_modules/@csstools/postcss-font-format-keywords, "^8.2" from node_modules/@csstools/postcss-hwb-function, "^8.2" from node_modules/@csstools/postcss-ic-unit, "^8.2" from node_modules/@csstools/postcss-is-pseudo-class, "^8.2" from node_modules/@csstools/postcss-nested-calc, "^8.2" from node_modules/@csstools/postcss-normalize-display-values, "^8.2" from node_modules/@csstools/postcss-oklab-function, "^8.3" from node_modules/@csstools/postcss-progressive-custom-properties, "^8.2" from node_modules/@csstools/postcss-stepped-value-functions, "^8.2" from node_modules/@csstools/postcss-text-decoration-shorthand, "^8.2" from node_modules/@csstools/postcss-trigonometric-functions, "^8.2" from node_modules/@csstools/postcss-unset-value, "^8.1.0" from node_modules/postcss-preset-env/node_modules/autoprefixer, "^8.4" from node_modules/css-blank-pseudo, "^8.4" from node_modules/css-has-pseudo, "^8.4" from node_modules/css-prefers-color-scheme, "^8.2" from node_modules/postcss-attribute-case-insensitive, "^8.4.6" from node_modules/postcss-clamp, "^8.2" from node_modules/postcss-color-functional-notation, "^8.4" from node_modules/postcss-color-hex-alpha, "^8.2" from node_modules/postcss-color-rebeccapurple, "^8.3" from node_modules/postcss-custom-media, "^8.2" from node_modules/postcss-custom-properties, "^8.3" from node_modules/postcss-custom-selectors, "^8.2" from node_modules/postcss-dir-pseudo-class, "^8.2" from node_modules/postcss-double-position-gradients, "^8.4" from node_modules/postcss-env-function, "^8.4" from node_modules/postcss-focus-visible, "^8.4" from node_modules/postcss-focus-within, "^8.1.0" from node_modules/postcss-font-variant, "^8.2" from node_modules/postcss-gap-properties, "^8.2" from node_modules/postcss-image-set-function, "^8.0.0" from node_modules/postcss-initial, "^8.2" from node_modules/postcss-lab-function, "^8.4" from node_modules/postcss-logical, "^8.1.0" from node_modules/postcss-media-minmax, "^8.2" from node_modules/postcss-nesting, "^8.2" from node_modules/postcss-overflow-shorthand, "^8" from node_modules/postcss-page-break, "^8.2" from node_modules/postcss-place, "^8.2" from node_modules/postcss-pseudo-class-any-link, "^8.0.3" from node_modules/postcss-replace-overflow-wrap, "^8.2" from node_modules/postcss-selector-not, "^8.0.0" from node_modules/postcss-import, "^8.3.3" from node_modules/postcss-js, ">=8.0.9" from node_modules/postcss-load-config, "^8.2.14" from node_modules/postcss-nested, "^8.2.15" from node_modules/cssnano-preset-default, "^8.2" from node_modules/@csstools/selector-specificity, "^8.0.9" from node_modules/css-declaration-sorter, "^8.2.15" from node_modules/cssnano-utils, "^8.2.2" from node_modules/postcss-calc, "^8.2.15" from node_modules/postcss-colormin, "^8.2.15" from node_modules/postcss-convert-values, "^8.2.15" from node_modules/postcss-discard-comments, "^8.2.15" from node_modules/postcss-discard-duplicates, "^8.2.15" from node_modules/postcss-discard-empty, "^8.2.15" from node_modules/postcss-discard-overridden, "^8.2.15" from node_modules/postcss-merge-longhand, "^8.2.15" from node_modules/postcss-merge-rules, "^8.2.15" from node_modules/postcss-minify-font-values, "^8.2.15" from node_modules/postcss-minify-gradients, "^8.2.15" from node_modules/postcss-minify-params, "^8.2.15" from node_modules/postcss-minify-selectors, "^8.2.15" from node_modules/postcss-normalize-charset, "^8.2.15" from node_modules/postcss-normalize-display-values, "^8.2.15" from node_modules/postcss-normalize-positions, "^8.2.15" from node_modules/postcss-normalize-repeat-style, "^8.2.15" from node_modules/postcss-normalize-string, "^8.2.15" from node_modules/postcss-normalize-timing-functions, "^8.2.15" from node_modules/postcss-normalize-unicode, "^8.2.15" from node_modules/postcss-normalize-url, "^8.2.15" from node_modules/postcss-normalize-whitespace, "^8.2.15" from node_modules/postcss-ordered-values, "^8.2.15" from node_modules/postcss-reduce-initial, "^8.2.15" from node_modules/postcss-reduce-transforms, "^8.2.15" from node_modules/postcss-svgo, "^8.2.15" from node_modules/postcss-unique-selectors

··· truncated, repeated errors exceed GitHub comment length max ···

│         ├─┬ postcss-modules-values@3.0.0
│         │ └── postcss@7.0.39 deduped invalid: ">= 8" from node_modules/postcss-normalize, "^8.2" from node_modules/postcss-preset-env, "^8.1.0" from node_modules/icss-utils, "^8.1.0" from node_modules/postcss-modules-extract-imports, "^8.1.0" from node_modules/postcss-modules-local-by-default, "^8.1.0" from node_modules/postcss-modules-scope, "^8.1.0" from node_modules/postcss-modules-values, "^8.2.15" from node_modules/cssnano, ">=8" from node_modules/postcss-browser-comments, "^8.2" from node_modules/@csstools/postcss-cascade-layers, "^8.2" from node_modules/@csstools/postcss-color-function, "^8.2" from node_modules/@csstools/postcss-font-format-keywords, "^8.2" from node_modules/@csstools/postcss-hwb-function, "^8.2" from node_modules/@csstools/postcss-ic-unit, "^8.2" from node_modules/@csstools/postcss-is-pseudo-class, "^8.2" from node_modules/@csstools/postcss-nested-calc, "^8.2" from node_modules/@csstools/postcss-normalize-display-values, "^8.2" from node_modules/@csstools/postcss-oklab-function, "^8.3" from node_modules/@csstools/postcss-progressive-custom-properties, "^8.2" from node_modules/@csstools/postcss-stepped-value-functions, "^8.2" from node_modules/@csstools/postcss-text-decoration-shorthand, "^8.2" from node_modules/@csstools/postcss-trigonometric-functions, "^8.2" from node_modules/@csstools/postcss-unset-value, "^8.1.0" from node_modules/postcss-preset-env/node_modules/autoprefixer, "^8.4" from node_modules/css-blank-pseudo, "^8.4" from node_modules/css-has-pseudo, "^8.4" from node_modules/css-prefers-color-scheme, "^8.2" from node_modules/postcss-attribute-case-insensitive, "^8.4.6" from node_modules/postcss-clamp, "^8.2" from node_modules/postcss-color-functional-notation, "^8.4" from node_modules/postcss-color-hex-alpha, "^8.2" from node_modules/postcss-color-rebeccapurple, "^8.3" from node_modules/postcss-custom-media, "^8.2" from node_modules/postcss-custom-properties, "^8.3" from node_modules/postcss-custom-selectors, "^8.2" from node_modules/postcss-dir-pseudo-class, "^8.2" from node_modules/postcss-double-position-gradients, "^8.4" from node_modules/postcss-env-function, "^8.4" from node_modules/postcss-focus-visible, "^8.4" from node_modules/postcss-focus-within, "^8.1.0" from node_modules/postcss-font-variant, "^8.2" from node_modules/postcss-gap-properties, "^8.2" from node_modules/postcss-image-set-function, "^8.0.0" from node_modules/postcss-initial, "^8.2" from node_modules/postcss-lab-function, "^8.4" from node_modules/postcss-logical, "^8.1.0" from node_modules/postcss-media-minmax, "^8.2" from node_modules/postcss-nesting, "^8.2" from node_modules/postcss-overflow-shorthand, "^8" from node_modules/postcss-page-break, "^8.2" from node_modules/postcss-place, "^8.2" from node_modules/postcss-pseudo-class-any-link, "^8.0.3" from node_modules/postcss-replace-overflow-wrap, "^8.2" from node_modules/postcss-selector-not, "^8.0.0" from node_modules/postcss-import, "^8.3.3" from node_modules/postcss-js, ">=8.0.9" from node_modules/postcss-load-config, "^8.2.14" from node_modules/postcss-nested, "^8.2.15" from node_modules/cssnano-preset-default, "^8.2" from node_modules/@csstools/selector-specificity, "^8.0.9" from node_modules/css-declaration-sorter, "^8.2.15" from node_modules/cssnano-utils, "^8.2.2" from node_modules/postcss-calc, "^8.2.15" from node_modules/postcss-colormin, "^8.2.15" from node_modules/postcss-convert-values, "^8.2.15" from node_modules/postcss-discard-comments, "^8.2.15" from node_modules/postcss-discard-duplicates, "^8.2.15" from node_modules/postcss-discard-empty, "^8.2.15" from node_modules/postcss-discard-overridden, "^8.2.15" from node_modules/postcss-merge-longhand, "^8.2.15" from node_modules/postcss-merge-rules, "^8.2.15" from node_modules/postcss-minify-font-values, "^8.2.15" from node_modules/postcss-minify-gradients, "^8.2.15" from node_modules/postcss-minify-params, "^8.2.15" from node_modules/postcss-minify-selectors, "^8.2.15" from node_modules/postcss-normalize-charset, "^8.2.15" from node_modules/postcss-normalize-display-values, "^8.2.15" from node_modules/postcss-normalize-positions, "^8.2.15" from node_modules/postcss-normalize-repeat-style, "^8.2.15" from node_modules/postcss-normalize-string, "^8.2.15" from node_modules/postcss-normalize-timing-functions, "^8.2.15" from node_modules/postcss-normalize-unicode, "^8.2.15" from node_modules/postcss-normalize-url, "^8.2.15" from node_modules/postcss-normalize-whitespace, "^8.2.15" from node_modules/postcss-ordered-values, "^8.2.15" from node_modules/postcss-reduce-initial, "^8.2.15" from node_modules/postcss-reduce-transforms, "^8.2.15" from node_modules/postcss-svgo, "^8.2.15" from node_modules/postcss-unique-selectors
│         └── postcss@7.0.39 deduped invalid: ">= 8" from node_modules/postcss-normalize, "^8.2" from node_modules/postcss-preset-env, "^8.1.0" from node_modules/icss-utils, "^8.1.0" from node_modules/postcss-modules-extract-imports, "^8.1.0" from node_modules/postcss-modules-local-by-default, "^8.1.0" from node_modules/postcss-modules-scope, "^8.1.0" from node_modules/postcss-modules-values, "^8.2.15" from node_modules/cssnano, ">=8" from node_modules/postcss-browser-comments, "^8.2" from node_modules/@csstools/postcss-cascade-layers, "^8.2" from node_modules/@csstools/postcss-color-function, "^8.2" from node_modules/@csstools/postcss-font-format-keywords, "^8.2" from node_modules/@csstools/postcss-hwb-function, "^8.2" from node_modules/@csstools/postcss-ic-unit, "^8.2" from node_modules/@csstools/postcss-is-pseudo-class, "^8.2" from node_modules/@csstools/postcss-nested-calc, "^8.2" from node_modules/@csstools/postcss-normalize-display-values, "^8.2" from node_modules/@csstools/postcss-oklab-function, "^8.3" from node_modules/@csstools/postcss-progressive-custom-properties, "^8.2" from node_modules/@csstools/postcss-stepped-value-functions, "^8.2" from node_modules/@csstools/postcss-text-decoration-shorthand, "^8.2" from node_modules/@csstools/postcss-trigonometric-functions, "^8.2" from node_modules/@csstools/postcss-unset-value, "^8.1.0" from node_modules/postcss-preset-env/node_modules/autoprefixer, "^8.4" from node_modules/css-blank-pseudo, "^8.4" from node_modules/css-has-pseudo, "^8.4" from node_modules/css-prefers-color-scheme, "^8.2" from node_modules/postcss-attribute-case-insensitive, "^8.4.6" from node_modules/postcss-clamp, "^8.2" from node_modules/postcss-color-functional-notation, "^8.4" from node_modules/postcss-color-hex-alpha, "^8.2" from node_modules/postcss-color-rebeccapurple, "^8.3" from node_modules/postcss-custom-media, "^8.2" from node_modules/postcss-custom-properties, "^8.3" from node_modules/postcss-custom-selectors, "^8.2" from node_modules/postcss-dir-pseudo-class, "^8.2" from node_modules/postcss-double-position-gradients, "^8.4" from node_modules/postcss-env-function, "^8.4" from node_modules/postcss-focus-visible, "^8.4" from node_modules/postcss-focus-within, "^8.1.0" from node_modules/postcss-font-variant, "^8.2" from node_modules/postcss-gap-properties, "^8.2" from node_modules/postcss-image-set-function, "^8.0.0" from node_modules/postcss-initial, "^8.2" from node_modules/postcss-lab-function, "^8.4" from node_modules/postcss-logical, "^8.1.0" from node_modules/postcss-media-minmax, "^8.2" from node_modules/postcss-nesting, "^8.2" from node_modules/postcss-overflow-shorthand, "^8" from node_modules/postcss-page-break, "^8.2" from node_modules/postcss-place, "^8.2" from node_modules/postcss-pseudo-class-any-link, "^8.0.3" from node_modules/postcss-replace-overflow-wrap, "^8.2" from node_modules/postcss-selector-not, "^8.0.0" from node_modules/postcss-import, "^8.3.3" from node_modules/postcss-js, ">=8.0.9" from node_modules/postcss-load-config, "^8.2.14" from node_modules/postcss-nested, "^8.2.15" from node_modules/cssnano-preset-default, "^8.2" from node_modules/@csstools/selector-specificity
└─┬ react-scripts@5.0.1
  ├─┬ css-loader@6.7.1
  │ └── postcss@8.4.16 deduped
  ├─┬ css-minimizer-webpack-plugin@3.4.1
  │ ├─┬ cssnano@5.1.13
  │ │ ├─┬ cssnano-preset-default@5.2.12

··· truncated, repeated errors exceed GitHub comment length max ···

  │ └── postcss@8.4.16
  ├─┬ postcss-flexbugs-fixes@5.0.2
  │ └── postcss@8.4.16 deduped
  ├─┬ postcss-loader@6.2.1
  │ └── postcss@8.4.16 deduped
  ├─┬ postcss-normalize@10.0.1
  │ ├─┬ postcss-browser-comments@4.0.0
  │ │ └── postcss@7.0.39 deduped invalid: ">= 8" from node_modules/postcss-normalize, "^8.2" from node_modules/postcss-preset-env, "^8.1.0" from node_modules/icss-utils, "^8.1.0" from node_modules/postcss-modules-extract-imports, "^8.1.0" from node_modules/postcss-modules-local-by-default, "^8.1.0" from node_modules/postcss-modules-scope, "^8.1.0" from node_modules/postcss-modules-values, "^8.2.15" from node_modules/cssnano, ">=8" from node_modules/postcss-browser-comments
  │ └── postcss@7.0.39 invalid: ">= 8" from node_modules/postcss-normalize, "^8.2" from node_modules/postcss-preset-env, "^8.1.0" from node_modules/icss-utils, "^8.1.0" from node_modules/postcss-modules-extract-imports, "^8.1.0" from node_modules/postcss-modules-local-by-default, "^8.1.0" from node_modules/postcss-modules-scope, "^8.1.0" from node_modules/postcss-modules-values, "^8.2.15" from node_modules/cssnano, ">=8" from node_modules/postcss-browser-comments
  ├─┬ postcss-preset-env@7.8.2
  │ ├─┬ @csstools/postcss-cascade-layers@1.1.1
  │ │ ├─┬ @csstools/selector-specificity@2.0.2
  │ │ │ └── postcss@7.0.39 deduped invalid: ">= 8" from node_modules/postcss-normalize, "^8.2" from node_modules/postcss-preset-env, "^8.1.0" from node_modules/icss-utils, "^8.1.0" from node_modules/postcss-modules-extract-imports, "^8.1.0" from node_modules/postcss-modules-local-by-default, "^8.1.0" from node_modules/postcss-modules-scope, "^8.1.0" from node_modules/postcss-modules-values, "^8.2.15" from node_modules/cssnano, ">=8" from node_modules/postcss-browser-comments, "^8.2" from node_modules/@csstools/postcss-cascade-layers, "^8.2" from node_modules/@csstools/postcss-color-function, "^8.2" from node_modules/@csstools/postcss-font-format-keywords, "^8.2" from node_modules/@csstools/postcss-hwb-function, "^8.2" from node_modules/@csstools/postcss-ic-unit, "^8.2" from node_modules/@csstools/postcss-is-pseudo-class, "^8.2" from node_modules/@csstools/postcss-nested-calc, "^8.2" from node_modules/@csstools/postcss-normalize-display-values, "^8.2" from node_modules/@csstools/postcss-oklab-function, "^8.3" from node_modules/@csstools/postcss-progressive-custom-properties, "^8.2" from node_modules/@csstools/postcss-stepped-value-functions, "^8.2" from node_modules/@csstools/postcss-text-decoration-shorthand, "^8.2" from node_modules/@csstools/postcss-trigonometric-functions, "^8.2" from node_modules/@csstools/postcss-unset-value, "^8.1.0" from node_modules/postcss-preset-env/node_modules/autoprefixer, "^8.4" from node_modules/css-blank-pseudo, "^8.4" from node_modules/css-has-pseudo, "^8.4" from node_modules/css-prefers-color-scheme, "^8.2" from node_modules/postcss-attribute-case-insensitive, "^8.4.6" from node_modules/postcss-clamp, "^8.2" from node_modules/postcss-color-functional-notation, "^8.4" from node_modules/postcss-color-hex-alpha, "^8.2" from node_modules/postcss-color-rebeccapurple, "^8.3" from node_modules/postcss-custom-media, "^8.2" from node_modules/postcss-custom-properties, "^8.3" from node_modules/postcss-custom-selectors, "^8.2" from node_modules/postcss-dir-pseudo-class, "^8.2" from node_modules/postcss-double-position-gradients, "^8.4" from node_modules/postcss-env-function, "^8.4" from node_modules/postcss-focus-visible, "^8.4" from node_modules/postcss-focus-within, "^8.1.0" from node_modules/postcss-font-variant, "^8.2" from node_modules/postcss-gap-properties, "^8.2" from node_modules/postcss-image-set-function, "^8.0.0" from node_modules/postcss-initial, "^8.2" from node_modules/postcss-lab-function, "^8.4" from node_modules/postcss-logical, "^8.1.0" from node_modules/postcss-media-minmax, "^8.2" from node_modules/postcss-nesting, "^8.2" from node_modules/postcss-overflow-shorthand, "^8" from node_modules/postcss-page-break, "^8.2" from node_modules/postcss-place, "^8.2" from node_modules/postcss-pseudo-class-any-link, "^8.0.3" from node_modules/postcss-replace-overflow-wrap, "^8.2" from node_modules/postcss-selector-not, "^8.0.0" from node_modules/postcss-import, "^8.3.3" from node_modules/postcss-js, ">=8.0.9" from node_modules/postcss-load-config, "^8.2.14" from node_modules/postcss-nested, "^8.2.15" from node_modules/cssnano-preset-default, "^8.2" from node_modules/@csstools/selector-specificity
  │ │ └── postcss@7.0.39 deduped invalid: ">= 8" from node_modules/postcss-normalize, "^8.2" from node_modules/postcss-preset-env, "^8.1.0" from node_modules/icss-utils, "^8.1.0" from node_modules/postcss-modules-extract-imports, "^8.1.0" from node_modules/postcss-modules-local-by-default, "^8.1.0" from node_modules/postcss-modules-scope, "^8.1.0" from node_modules/postcss-modules-values, "^8.2.15" from node_modules/cssnano, ">=8" from node_modules/postcss-browser-comments, "^8.2" from node_modules/@csstools/postcss-cascade-layers
  │ ├─┬ @csstools/postcss-color-function@1.1.1
  │ │ └── postcss@7.0.39 deduped invalid: ">= 8" from node_modules/postcss-normalize, "^8.2" from node_modules/postcss-preset-env, "^8.1.0" from node_modules/icss-utils, "^8.1.0" from node_modules/postcss-modules-extract-imports, "^8.1.0" from node_modules/postcss-modules-local-by-default, "^8.1.0" from node_modules/postcss-modules-scope, "^8.1.0" from node_modules/postcss-modules-values, "^8.2.15" from node_modules/cssnano, ">=8" from node_modules/postcss-browser-comments, "^8.2" from node_modules/@csstools/postcss-cascade-layers, "^8.2" from node_modules/@csstools/postcss-color-function

··· truncated, repeated errors exceed GitHub comment length max ···

  │ ├─┬ postcss-replace-overflow-wrap@4.0.0
  │ │ └── postcss@7.0.39 deduped invalid: ">= 8" from node_modules/postcss-normalize, "^8.2" from node_modules/postcss-preset-env, "^8.1.0" from node_modules/icss-utils, "^8.1.0" from node_modules/postcss-modules-extract-imports, "^8.1.0" from node_modules/postcss-modules-local-by-default, "^8.1.0" from node_modules/postcss-modules-scope, "^8.1.0" from node_modules/postcss-modules-values, "^8.2.15" from node_modules/cssnano, ">=8" from node_modules/postcss-browser-comments, "^8.2" from node_modules/@csstools/postcss-cascade-layers, "^8.2" from node_modules/@csstools/postcss-color-function, "^8.2" from node_modules/@csstools/postcss-font-format-keywords, "^8.2" from node_modules/@csstools/postcss-hwb-function, "^8.2" from node_modules/@csstools/postcss-ic-unit, "^8.2" from node_modules/@csstools/postcss-is-pseudo-class, "^8.2" from node_modules/@csstools/postcss-nested-calc, "^8.2" from node_modules/@csstools/postcss-normalize-display-values, "^8.2" from node_modules/@csstools/postcss-oklab-function, "^8.3" from node_modules/@csstools/postcss-progressive-custom-properties, "^8.2" from node_modules/@csstools/postcss-stepped-value-functions, "^8.2" from node_modules/@csstools/postcss-text-decoration-shorthand, "^8.2" from node_modules/@csstools/postcss-trigonometric-functions, "^8.2" from node_modules/@csstools/postcss-unset-value, "^8.1.0" from node_modules/postcss-preset-env/node_modules/autoprefixer, "^8.4" from node_modules/css-blank-pseudo, "^8.4" from node_modules/css-has-pseudo, "^8.4" from node_modules/css-prefers-color-scheme, "^8.2" from node_modules/postcss-attribute-case-insensitive, "^8.4.6" from node_modules/postcss-clamp, "^8.2" from node_modules/postcss-color-functional-notation, "^8.4" from node_modules/postcss-color-hex-alpha, "^8.2" from node_modules/postcss-color-rebeccapurple, "^8.3" from node_modules/postcss-custom-media, "^8.2" from node_modules/postcss-custom-properties, "^8.3" from node_modules/postcss-custom-selectors, "^8.2" from node_modules/postcss-dir-pseudo-class, "^8.2" from node_modules/postcss-double-position-gradients, "^8.4" from node_modules/postcss-env-function, "^8.4" from node_modules/postcss-focus-visible, "^8.4" from node_modules/postcss-focus-within, "^8.1.0" from node_modules/postcss-font-variant, "^8.2" from node_modules/postcss-gap-properties, "^8.2" from node_modules/postcss-image-set-function, "^8.0.0" from node_modules/postcss-initial, "^8.2" from node_modules/postcss-lab-function, "^8.4" from node_modules/postcss-logical, "^8.1.0" from node_modules/postcss-media-minmax, "^8.2" from node_modules/postcss-nesting, "^8.2" from node_modules/postcss-overflow-shorthand, "^8" from node_modules/postcss-page-break, "^8.2" from node_modules/postcss-place, "^8.2" from node_modules/postcss-pseudo-class-any-link, "^8.0.3" from node_modules/postcss-replace-overflow-wrap
  │ ├─┬ postcss-selector-not@6.0.1
  │ │ └── postcss@7.0.39 deduped invalid: ">= 8" from node_modules/postcss-normalize, "^8.2" from node_modules/postcss-preset-env, "^8.1.0" from node_modules/icss-utils, "^8.1.0" from node_modules/postcss-modules-extract-imports, "^8.1.0" from node_modules/postcss-modules-local-by-default, "^8.1.0" from node_modules/postcss-modules-scope, "^8.1.0" from node_modules/postcss-modules-values, "^8.2.15" from node_modules/cssnano, ">=8" from node_modules/postcss-browser-comments, "^8.2" from node_modules/@csstools/postcss-cascade-layers, "^8.2" from node_modules/@csstools/postcss-color-function, "^8.2" from node_modules/@csstools/postcss-font-format-keywords, "^8.2" from node_modules/@csstools/postcss-hwb-function, "^8.2" from node_modules/@csstools/postcss-ic-unit, "^8.2" from node_modules/@csstools/postcss-is-pseudo-class, "^8.2" from node_modules/@csstools/postcss-nested-calc, "^8.2" from node_modules/@csstools/postcss-normalize-display-values, "^8.2" from node_modules/@csstools/postcss-oklab-function, "^8.3" from node_modules/@csstools/postcss-progressive-custom-properties, "^8.2" from node_modules/@csstools/postcss-stepped-value-functions, "^8.2" from node_modules/@csstools/postcss-text-decoration-shorthand, "^8.2" from node_modules/@csstools/postcss-trigonometric-functions, "^8.2" from node_modules/@csstools/postcss-unset-value, "^8.1.0" from node_modules/postcss-preset-env/node_modules/autoprefixer, "^8.4" from node_modules/css-blank-pseudo, "^8.4" from node_modules/css-has-pseudo, "^8.4" from node_modules/css-prefers-color-scheme, "^8.2" from node_modules/postcss-attribute-case-insensitive, "^8.4.6" from node_modules/postcss-clamp, "^8.2" from node_modules/postcss-color-functional-notation, "^8.4" from node_modules/postcss-color-hex-alpha, "^8.2" from node_modules/postcss-color-rebeccapurple, "^8.3" from node_modules/postcss-custom-media, "^8.2" from node_modules/postcss-custom-properties, "^8.3" from node_modules/postcss-custom-selectors, "^8.2" from node_modules/postcss-dir-pseudo-class, "^8.2" from node_modules/postcss-double-position-gradients, "^8.4" from node_modules/postcss-env-function, "^8.4" from node_modules/postcss-focus-visible, "^8.4" from node_modules/postcss-focus-within, "^8.1.0" from node_modules/postcss-font-variant, "^8.2" from node_modules/postcss-gap-properties, "^8.2" from node_modules/postcss-image-set-function, "^8.0.0" from node_modules/postcss-initial, "^8.2" from node_modules/postcss-lab-function, "^8.4" from node_modules/postcss-logical, "^8.1.0" from node_modules/postcss-media-minmax, "^8.2" from node_modules/postcss-nesting, "^8.2" from node_modules/postcss-overflow-shorthand, "^8" from node_modules/postcss-page-break, "^8.2" from node_modules/postcss-place, "^8.2" from node_modules/postcss-pseudo-class-any-link, "^8.0.3" from node_modules/postcss-replace-overflow-wrap, "^8.2" from node_modules/postcss-selector-not
  │ └── postcss@7.0.39 deduped invalid: ">= 8" from node_modules/postcss-normalize, "^8.2" from node_modules/postcss-preset-env
  ├── postcss@8.4.16
  ├─┬ resolve-url-loader@4.0.0
  │ └── postcss@7.0.39 deduped invalid: ">= 8" from node_modules/postcss-normalize, "^8.2" from node_modules/postcss-preset-env
  └─┬ tailwindcss@3.1.8
    ├─┬ postcss-import@14.1.0
    │ └── postcss@7.0.39 deduped invalid: ">= 8" from node_modules/postcss-normalize, "^8.2" from node_modules/postcss-preset-env, "^8.1.0" from node_modules/icss-utils, "^8.1.0" from node_modules/postcss-modules-extract-imports, "^8.1.0" from node_modules/postcss-modules-local-by-default, "^8.1.0" from node_modules/postcss-modules-scope, "^8.1.0" from node_modules/postcss-modules-values, "^8.2.15" from node_modules/cssnano, ">=8" from node_modules/postcss-browser-comments, "^8.2" from node_modules/@csstools/postcss-cascade-layers, "^8.2" from node_modules/@csstools/postcss-color-function, "^8.2" from node_modules/@csstools/postcss-font-format-keywords, "^8.2" from node_modules/@csstools/postcss-hwb-function, "^8.2" from node_modules/@csstools/postcss-ic-unit, "^8.2" from node_modules/@csstools/postcss-is-pseudo-class, "^8.2" from node_modules/@csstools/postcss-nested-calc, "^8.2" from node_modules/@csstools/postcss-normalize-display-values, "^8.2" from node_modules/@csstools/postcss-oklab-function, "^8.3" from node_modules/@csstools/postcss-progressive-custom-properties, "^8.2" from node_modules/@csstools/postcss-stepped-value-functions, "^8.2" from node_modules/@csstools/postcss-text-decoration-shorthand, "^8.2" from node_modules/@csstools/postcss-trigonometric-functions, "^8.2" from node_modules/@csstools/postcss-unset-value, "^8.1.0" from node_modules/postcss-preset-env/node_modules/autoprefixer, "^8.4" from node_modules/css-blank-pseudo, "^8.4" from node_modules/css-has-pseudo, "^8.4" from node_modules/css-prefers-color-scheme, "^8.2" from node_modules/postcss-attribute-case-insensitive, "^8.4.6" from node_modules/postcss-clamp, "^8.2" from node_modules/postcss-color-functional-notation, "^8.4" from node_modules/postcss-color-hex-alpha, "^8.2" from node_modules/postcss-color-rebeccapurple, "^8.3" from node_modules/postcss-custom-media, "^8.2" from node_modules/postcss-custom-properties, "^8.3" from node_modules/postcss-custom-selectors, "^8.2" from node_modules/postcss-dir-pseudo-class, "^8.2" from node_modules/postcss-double-position-gradients, "^8.4" from node_modules/postcss-env-function, "^8.4" from node_modules/postcss-focus-visible, "^8.4" from node_modules/postcss-focus-within, "^8.1.0" from node_modules/postcss-font-variant, "^8.2" from node_modules/postcss-gap-properties, "^8.2" from node_modules/postcss-image-set-function, "^8.0.0" from node_modules/postcss-initial, "^8.2" from node_modules/postcss-lab-function, "^8.4" from node_modules/postcss-logical, "^8.1.0" from node_modules/postcss-media-minmax, "^8.2" from node_modules/postcss-nesting, "^8.2" from node_modules/postcss-overflow-shorthand, "^8" from node_modules/postcss-page-break, "^8.2" from node_modules/postcss-place, "^8.2" from node_modules/postcss-pseudo-class-any-link, "^8.0.3" from node_modules/postcss-replace-overflow-wrap, "^8.2" from node_modules/postcss-selector-not, "^8.0.0" from node_modules/postcss-import

··· truncated, repeated errors exceed GitHub comment length max ···

    ├─┬ postcss-nested@5.0.6
    │ └── postcss@7.0.39 deduped invalid: ">= 8" from node_modules/postcss-normalize, "^8.2" from node_modules/postcss-preset-env, "^8.1.0" from node_modules/icss-utils, "^8.1.0" from node_modules/postcss-modules-extract-imports, "^8.1.0" from node_modules/postcss-modules-local-by-default, "^8.1.0" from node_modules/postcss-modules-scope, "^8.1.0" from node_modules/postcss-modules-values, "^8.2.15" from node_modules/cssnano, ">=8" from node_modules/postcss-browser-comments, "^8.2" from node_modules/@csstools/postcss-cascade-layers, "^8.2" from node_modules/@csstools/postcss-color-function, "^8.2" from node_modules/@csstools/postcss-font-format-keywords, "^8.2" from node_modules/@csstools/postcss-hwb-function, "^8.2" from node_modules/@csstools/postcss-ic-unit, "^8.2" from node_modules/@csstools/postcss-is-pseudo-class, "^8.2" from node_modules/@csstools/postcss-nested-calc, "^8.2" from node_modules/@csstools/postcss-normalize-display-values, "^8.2" from node_modules/@csstools/postcss-oklab-function, "^8.3" from node_modules/@csstools/postcss-progressive-custom-properties, "^8.2" from node_modules/@csstools/postcss-stepped-value-functions, "^8.2" from node_modules/@csstools/postcss-text-decoration-shorthand, "^8.2" from node_modules/@csstools/postcss-trigonometric-functions, "^8.2" from node_modules/@csstools/postcss-unset-value, "^8.1.0" from node_modules/postcss-preset-env/node_modules/autoprefixer, "^8.4" from node_modules/css-blank-pseudo, "^8.4" from node_modules/css-has-pseudo, "^8.4" from node_modules/css-prefers-color-scheme, "^8.2" from node_modules/postcss-attribute-case-insensitive, "^8.4.6" from node_modules/postcss-clamp, "^8.2" from node_modules/postcss-color-functional-notation, "^8.4" from node_modules/postcss-color-hex-alpha, "^8.2" from node_modules/postcss-color-rebeccapurple, "^8.3" from node_modules/postcss-custom-media, "^8.2" from node_modules/postcss-custom-properties, "^8.3" from node_modules/postcss-custom-selectors, "^8.2" from node_modules/postcss-dir-pseudo-class, "^8.2" from node_modules/postcss-double-position-gradients, "^8.4" from node_modules/postcss-env-function, "^8.4" from node_modules/postcss-focus-visible, "^8.4" from node_modules/postcss-focus-within, "^8.1.0" from node_modules/postcss-font-variant, "^8.2" from node_modules/postcss-gap-properties, "^8.2" from node_modules/postcss-image-set-function, "^8.0.0" from node_modules/postcss-initial, "^8.2" from node_modules/postcss-lab-function, "^8.4" from node_modules/postcss-logical, "^8.1.0" from node_modules/postcss-media-minmax, "^8.2" from node_modules/postcss-nesting, "^8.2" from node_modules/postcss-overflow-shorthand, "^8" from node_modules/postcss-page-break, "^8.2" from node_modules/postcss-place, "^8.2" from node_modules/postcss-pseudo-class-any-link, "^8.0.3" from node_modules/postcss-replace-overflow-wrap, "^8.2" from node_modules/postcss-selector-not, "^8.0.0" from node_modules/postcss-import, "^8.3.3" from node_modules/postcss-js, ">=8.0.9" from node_modules/postcss-load-config, "^8.2.14" from node_modules/postcss-nested
    └── postcss@8.4.16

npm ERR! code ELSPROBLEMS

To Reproduce

As with #18298 this cannot use npx sb@next repro because it is only reproducible when using npm v8. Here is a repository that contains three commits demonstrating the issue:

https://github.com/pushred/storybook-init-npm-v8-lockfile-issue-repro/commits/main

• To return to a working state reset HEAD to pushred/storybook-init-npm-v8-lockfile-issue-repro@410cb43

• To break it again: run rm package-lock.json && node_modules && npm i

  • Alternately, run npm i --legacy-peer-deps but the effect is the same

• npm ls postcss to observe broken dependency graph andnpm run build to observe failing CRA production build

System

System:
  OS: macOS 12.5.1
  CPU: (16) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
Binaries:
  Node: 16.15.1 - ~/.nvm/versions/node/v16.15.1/bin/node
  Yarn: 1.22.19 - /usr/local/bin/yarn
  npm: 8.19.1 - ~/.nvm/versions/node/v16.15.1/bin/npm
Browsers:
  Chrome: 105.0.5195.125
  Edge: 105.0.1343.42
  Firefox: 88.0.1
  Safari: 15.6.1
npmPackages:
  @storybook/addon-actions: ^6.5.12 => 6.5.12 
  @storybook/addon-essentials: ^6.5.12 => 6.5.12 
  @storybook/addon-interactions: ^6.5.12 => 6.5.12 
  @storybook/addon-links: ^6.5.12 => 6.5.12 
  @storybook/builder-webpack5: ^6.5.12 => 6.5.12 
  @storybook/manager-webpack5: ^6.5.12 => 6.5.12 
  @storybook/node-logger: ^6.5.12 => 6.5.12 
  @storybook/preset-create-react-app: ^4.1.2 => 4.1.2 
  @storybook/react: ^6.5.12 => 6.5.12 
  @storybook/testing-library: ^0.0.13 => 0.0.13 

Additional context

This uses the legacy peer dependency flag workaround previously discussed in #18298

We cannot use Yarn unfortunately. Storybook will be removed from the project if it is not compatible with the latest patch version of npm shipping with the active LTS version of Node. I am going to attempt making Storybook an optional dependency to avoid this from affecting our prod builds but I'm not optimistic this will work without breaking Storybook and/or Chromatic.

[pushred]

I've managed to workaround this issue (so far) by overriding a Sass-related Webpack plugin that react-scripts/CRA require, called resolve-url-loader. The version required depends on PostCSS v7 but the latest major version upgrades to PostCSS v8. The override creates a separate issue where PostCSS is not found and builds fail with this error:

Loading PostCSS "postcss-preset-env" plugin failed: Cannot find module 'postcss'
Require stack:
- /Users/example/dev/storybook-init-npm-v8-lockfile-issue-repro/node_modules/postcss-preset-env/node_modules/autoprefixer/lib/utils.js
- /Users/example/dev/storybook-init-npm-v8-lockfile-issue-repro/node_modules/postcss-preset-env/node_modules/autoprefixer/lib/browsers.js
- /Users/example/dev/storybook-init-npm-v8-lockfile-issue-repro/node_modules/postcss-preset-env/node_modules/autoprefixer/lib/autoprefixer.js
- /Users/example/dev/storybook-init-npm-v8-lockfile-issue-repro/node_modules/postcss-preset-env/dist/index.cjs
- /Users/example/dev/storybook-init-npm-v8-lockfile-issue-repro/node_modules/react-scripts/node_modules/postcss-loader/dist/utils.js
- /Users/example/dev/storybook-init-npm-v8-lockfile-issue-repro/node_modules/react-scripts/node_modules/postcss-loader/dist/index.js
- /Users/example/dev/storybook-init-npm-v8-lockfile-issue-repro/node_modules/react-scripts/node_modules/postcss-loader/dist/cjs.js
- /Users/example/dev/storybook-init-npm-v8-lockfile-issue-repro/node_modules/loader-runner/lib/loadLoader.js
- /Users/example/dev/storybook-init-npm-v8-lockfile-issue-repro/node_modules/loader-runner/lib/LoaderRunner.js
- /Users/example/dev/storybook-init-npm-v8-lockfile-issue-repro/node_modules/webpack/lib/NormalModule.js
- /Users/example/dev/storybook-init-npm-v8-lockfile-issue-repro/node_modules/webpack-manifest-plugin/dist/index.js
- /Users/example/dev/storybook-init-npm-v8-lockfile-issue-repro/node_modules/react-scripts/config/webpack.config.js
- /Users/example/dev/storybook-init-npm-v8-lockfile-issue-repro/node_modules/react-scripts/scripts/build.js

Simply installing the same version of PostCSS as react-scripts directly in the project addresses this however. So given the solution this isn't necessarily a Storybook-related issue. I'll open a CRA PR to bump resolve-url-loader. In my testing I have seen some non-deterministic install behavior post-override however where I still got a PostCSS conflict when installing fresh without an existing node_modules and package-lock.json file. I'm currently not able to reproduce that but I was able to workaround that as well by installing all Storybook-related packages as optional dependencies. This removed manager-webpack4 from the tree and it's potential for conflict.

The full workaround can be seen here:

https://github.com/pushred/storybook-init-npm-v8-lockfile-issue-repro/tree/workaround

[pushred]

Actually optional dependencies are not a possible solution for this. Builds fail when Storybook is missing due to a separate CRA issue where it attempts to bundle story modules:

#12625

[jithurjacob]

Facing the same issue.

[el-j]

had the same issue and fixed with override in package.json

 "overrides": {
    "postcss": "8.4.19",
 }

[valentinpalkovic]

Thanks for the detailed write-up! The dep conflict was rooted in @storybook/manager-webpack5 pulling its own PostCSS resolution, both of which were removed in Storybook 7.0 (manager-webpack5 bundled into the framework, implicit postcss removed in 6.2). CRA itself is also no longer the recommended setup — @storybook/react-vite or @storybook/nextjs-vite avoid this class of conflict entirely. Closing as obsolete; please open a fresh issue if you reproduce on v10.