使用 pnpm 安装 create React 应用程序显示警告

Question

使用pnpm dlx和为 create-react 应用程序（版本 5.0.0）安装依赖项时pnpm import，我收到一条警告，提示应安装对等依赖项。React 的开发环境运行得很好。使用时不会出现此警告消息npx。除了安装对等依赖项之外，如何修复此警告消息？提前致谢。

\n

我做了什么：

\n

\n
1. 在命令行中使用 pnpm dlx 创建 React 应用程序
\n

\n

pnpm dlx create-react-app ./temp-app\n

\n

\n
2. 上面的步骤创建了一个 package-lock.json 文件。因此，要创建 pnpm 的锁定文件，
\n

\n

pnpm import package-lock.json\n

\n

\n
3. 这创建了一个 pnpm-lock.yaml 文件，其中包含如下警告消息
\n

\n

\xe2\x80\x89WARN\xe2\x80\x89 Issues with peer dependencies found\n.\n\xe2\x94\x9c\xe2\x94\x80\xe2\x94\xac @testing-library/user-event\n\xe2\x94\x82 \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 \xe2\x9c\x95 missing peer @testing-library/dom@>=7.21.4\n\xe2\x94\x94\xe2\x94\x80\xe2\x94\xac react-scripts\n  \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 \xe2\x9c\x95 missing peer typescript@"^3.2.1 || ^4"\n  \xe2\x94\x9c\xe2\x94\x80\xe2\x94\xac eslint-config-react-app\n  \xe2\x94\x82 \xe2\x94\x9c\xe2\x94\x80\xe2\x94\xac @typescript-eslint/eslint-plugin\n  \xe2\x94\x82 \xe2\x94\x82 \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 \xe2\x9c\x95 missing peer typescript@"*"\n  \xe2\x94\x82 \xe2\x94\x82 \xe2\x94\x94\xe2\x94\x80\xe2\x94\xac @typescript-eslint/experimental-utils\n  \xe2\x94\x82 \xe2\x94\x82   \xe2\x94\x94\xe2\x94\x80\xe2\x94\xac @typescript-eslint/typescript-estree\n  \xe2\x94\x82 \xe2\x94\x82     \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 \xe2\x9c\x95 missing peer typescript@"*"\n  \xe2\x94\x82 \xe2\x94\x82     \xe2\x94\x94\xe2\x94\x80\xe2\x94\xac tsutils\n  \xe2\x94\x82 \xe2\x94\x82       \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 \xe2\x9c\x95 missing peer 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"\n  \xe2\x94\x82 \xe2\x94\x9c\xe2\x94\x80\xe2\x94\xac @typescript-eslint/parser\n  \xe2\x94\x82 \xe2\x94\x82 \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 \xe2\x9c\x95 missing peer typescript@"*"\n  \xe2\x94\x82 \xe2\x94\x94\xe2\x94\x80\xe2\x94\xac eslint-plugin-flowtype\n  \xe2\x94\x82   \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 \xe2\x9c\x95 missing peer @babel/plugin-syntax-flow@^7.14.5\n  \xe2\x94\x82   \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 \xe2\x9c\x95 missing peer @babel/plugin-transform-react-jsx@^7.14.9\n  \xe2\x94\x9c\xe2\x94\x80\xe2\x94\xac react-dev-utils\n  \xe2\x94\x82 \xe2\x94\x94\xe2\x94\x80\xe2\x94\xac fork-ts-checker-webpack-plugin\n  \xe2\x94\x82   \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 \xe2\x9c\x95 missing peer typescript@">= 2.7"\n  \xe2\x94\x94\xe2\x94\x80\xe2\x94\xac tailwindcss\n    \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 \xe2\x9c\x95 missing peer autoprefixer@^10.0.2\nPeer dependencies that should be installed:\n  @babel/plugin-syntax-flow@^7.14.5              @testing-library/dom@>=7.21.4                  typescript@">=3.2.1 <4.0.0 || >=4.0.0 <5.0.0"  \n  @babel/plugin-transform-react-jsx@^7.14.9      autoprefixer@^10.0.2 \n

\n

Answer 1

如果出现此警告，您还需要安装这些依赖项。

\n

复制下面列出的所有包Peer dependencies that should be installed:并键入以下命令：

\n

pnpm add your-dependencies-list\n

\n

并将 替换your-dependencies-list为列出的所有对等依赖项列表。

\n

需要注意的一件事是，例如，如果您尝试添加依赖项作为开发依赖项，然后出现此警告，那么您需要执行上述命令，但-D需要--dev在包，以便将它们添加为开发依赖项。

\n

当我尝试安装parcel为开发依赖项时，我也出现了同样的问题

\n

Progress: resolved 318, reused 318, downloaded 0, added 0, done\n\xe2\x80\x89WARN\xe2\x80\x89 Issues with peer dependencies found\n.\n\xe2\x94\x94\xe2\x94\x80\xe2\x94\xac parcel\n  \xe2\x94\x94\xe2\x94\x80\xe2\x94\xac @parcel/config-default\n    \xe2\x94\x9c\xe2\x94\x80\xe2\x94\xac @parcel/optimizer-htmlnano\n    \xe2\x94\x82 \xe2\x94\x94\xe2\x94\x80\xe2\x94\xac htmlnano\n    \xe2\x94\x82   \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 \xe2\x9c\x95 missing peer postcss@^8.3.11\n    \xe2\x94\x94\xe2\x94\x80\xe2\x94\xac @parcel/transformer-postcss\n      \xe2\x94\x94\xe2\x94\x80\xe2\x94\xac postcss-modules\n        \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 \xe2\x9c\x95 missing peer postcss@^8.0.0\n        \xe2\x94\x9c\xe2\x94\x80\xe2\x94\xac postcss-modules-extract-imports\n        \xe2\x94\x82 \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 \xe2\x9c\x95 missing peer postcss@^8.1.0\n        \xe2\x94\x9c\xe2\x94\x80\xe2\x94\xac postcss-modules-local-by-default\n        \xe2\x94\x82 \xe2\x94\x9c\xe2\x94\x80\xe2\x94\x80 \xe2\x9c\x95 missing peer postcss@^8.1.0\n        \xe2\x94\x82 \xe2\x94\x94\xe2\x94\x80\xe2\x94\xac icss-utils\n        \xe2\x94\x82   \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 \xe2\x9c\x95 missing peer postcss@^8.1.0\n        \xe2\x94\x9c\xe2\x94\x80\xe2\x94\xac postcss-modules-scope\n        \xe2\x94\x82 \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 \xe2\x9c\x95 missing peer postcss@^8.1.0\n        \xe2\x94\x94\xe2\x94\x80\xe2\x94\xac postcss-modules-values\n          \xe2\x94\x94\xe2\x94\x80\xe2\x94\x80 \xe2\x9c\x95 missing peer postcss@^8.1.0\nPeer dependencies that should be installed:\n  postcss@">=8.3.11 <9.0.0"\n

\n

所以我运行了以下命令：

\n

pnpm add -D postcss@">=8.3.11 <9.0.0"\n

\n

和万岁

\n

Packages: +5 -11\n+++++-----------\nProgress: resolved 891, reused 891, downloaded 0, added 5, done\n\ndevDependencies:\n- parcel 2.2.1\n+ parcel 2.2.1\n+ postcss 8.4.5\n

\n

一切顺利！

\n