本文介绍了将 PostCSS 更新到版本 8 React 后,应用程序无法运行的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

当我在我的应用中工作时,我注意到我有 80 个漏洞,主要是因为对等版本,比如一个要求 react 16.8.0,我有 17.0.1 之类的,但另一个说:

I was working in my app when I noticed I had 80 vulnerabilities, mainly because of peer versions, like one asked for react 16.8.0 and I had 17.0.1 and stuff like that, but another one said:

  Moderate        Regular Expression Denial of Service

  Package         postcss

  Patched in      >=8.2.10

  Dependency of   react-scripts

  Path            react-scripts > postcss-preset-env >
                  postcss-replace-overflow-wrap > postcss

  More info       https://npmjs.com/advisories/1693

所以我搜索并更新了所有内容.现在我有 0 个漏洞,但我的应用程序没有运行,所以看起来它无论如何都没有漏洞.当我运行它时,它向我显示了很多这样的消息(它只改变了在这种情况下它说伪类任何"的部分):

So I searched and I updated everything. Now I have 0 vulnerabilities but my application doesn't run so it looks like it has no vulnerabilities anyway.When I run it, it shows me a lot of messages like this one (it only changes the part where in this case it says 'pseudo-class-any'):

postcss-pseudo-class-any-link: postcss.plugin was deprecated. Migration guide:
https://evilmartians.com/chronicles/postcss-8-plugin-migration

然后它说:

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

推荐答案

问题是很多库,例如 react-scripts,还没有从 PostCSS 7 更新到 PostCSS 8.

我还做了一个强制更新了一些我的依赖项出于同样的原因,在 React 构建期间,看到了这条消息:

I also did a forced update of some of my dependencies for the same reasons, and during the React build, saw this message:

Post-css-modules-values: postcss.plugin was deprecated. Migration guide:
https://evilmartians.com/chronicles/postcss-8-plugin-migration

相同的消息还提到了以下所有内容,参考迁移指南:

Identical messages mentioned all of the following as well, referencing the migration guide:

postcss-modules-local-by-default, modules-extract-imports, postcss-modules-scope, postcss-import-parser, postcss-icss-parser, postcss-url-parser, postcss-flexbugs-fixes, autoprefixer, postcss-ttribute-case-insensitive, css-blank-pseudo, postcss-color-functional-notation, postcss-color-gray, postcss-color-hex-alpha, postcss-color-mod-function, postcss-color-rebeccapurple, postcss-custom-media,
postcss-custom-properties, postcss-custom-selectors, postcss-dir-pseudo-class, postcss-double-position-gradients, postcss-env-fn, postcss-focus-visible, postcss-focus-within, postcss-font-variant, postcss-gap-properties, css-has-pseudo, postcss-image-set-function

然后我得到一个错误(几乎与操作相同),涉及 Bootstrap 和 PostCSS:

Then I got an error (almost identical to the op's), involving Bootstrap and PostCSS:

./node_modules/bootstrap/dist/css/bootstrap.min.css (./node_modules/css-loader/dist/cjs.js??ref--5-oneOf-4-1!./node_modules/postcss-loader/src??postcss!./node_modules/bootstrap/dist/css/bootstrap.min.css)

TypeError: Cannot read property 'unprefixed' of undefined

许多包都包含 PostCSS 作为依赖项.

Many packages include PostCSS as a dependency.

查看 有关使用 PostCSS 8.0 更新插件的文档 似乎等待我们项目中的包更新到 PostCSS 8.0 API,或者根据 PostCSS 8.0 更新文档手动分叉和编辑它们,可能是某些项目的唯一选择.

Looking at the docs about updating plugins for using PostCSS 8.0 it seems that waiting until packages in our projects update to the PostCSS 8.0 API, or manually forking and editing them per PostCSS's 8.0 update documentation, may be the only options for some projects.

比这更好的答案将不胜感激.

A better answer than this would be appreciated.

这篇关于将 PostCSS 更新到版本 8 React 后,应用程序无法运行的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-24 11:11