Using pnpm to install create react app shows warning
When installing dependencies for a create-react app(version 5.0.0) using pnpm dlx and pnpm import, i get a warning that peer dependencies should be installed. The dev environment for react spins up just fine. This warn message does not show up when using npx. How can i fix this warn message other than installing the peer dependencies?. Thanks in advance.
What i did:
Create react app using pnpm dlx in the command-line
pnpm dlx create-react-app ./temp-app
The above step created a package-lock.json file. So, to create pnpm's lock file,
pnpm import package-lock.json
This created a pnpm-lock.yaml file with a warn message as below
WARN Issues with peer dependencies found
.
├─┬ @testing-library/user-event
│ └── ✕ missing peer @testing-library/dom@>=7.21.4
└─┬ react-scripts
├── ✕ missing peer typescript@"^3.2.1 || ^4"
├─┬ eslint-config-react-app
│ ├─┬ @typescript-eslint/eslint-plugin
│ │ ├── ✕ missing peer typescript@"*"
│ │ └─┬ @typescript-eslint/experimental-utils
│ │ └─┬ @typescript-eslint/typescript-estree
│ │ ├── ✕ missing peer typescript@"*"
│ │ └─┬ tsutils
│ │ └── ✕ 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"
│ ├─┬ @typescript-eslint/parser
│ │ └── ✕ missing peer typescript@"*"
│ └─┬ eslint-plugin-flowtype
│ ├── ✕ missing peer @babel/plugin-syntax-flow@^7.14.5
│ └── ✕ missing peer @babel/plugin-transform-react-jsx@^7.14.9
├─┬ react-dev-utils
│ └─┬ fork-ts-checker-webpack-plugin
│ └── ✕ missing peer typescript@">= 2.7"
└─┬ tailwindcss
└── ✕ missing peer autoprefixer@^10.0.2
Peer dependencies that should be installed:
@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"
@babel/plugin-transform-react-jsx@^7.14.9 autoprefixer@^10.0.2You need to install those dependencies too if this warning shows up. Copy all the packages listed below Peer dependencies that should be installed: and type this command: pnpm add your-dependencies-list and replace the your-dependencies-list with all the list of peer dependencies which were listed. One thing to note is for example if you were trying to add a dependency as a dev dependency and then this warning showed up, then you'll need to execute the above command but you'll need to add a -D or --dev flag before the packages so that it adds them as dev dependency. Same issue occurred with me when i tried installing parcel as a dev dependency Progress: resolved 318, reused 318, downloaded 0, added 0, done WARN Issues with peer dependencies found . └─┬ parcel └─┬ @parcel/config-default ├─┬ @parcel/optimizer-htmlnano │ └─┬ htmlnano │ └── ✕ missing peer postcss@^8.3.11 └─┬ @parcel/transformer-postcss └─┬ postcss-modules ├── ✕ missing peer postcss@^8.0.0 ├─┬ postcss-modules-extract-imports │ └── ✕ missing peer postcss@^8.1.0 ├─┬ postcss-modules-local-by-default │ ├── ✕ missing peer postcss@^8.1.0 │ └─┬ icss-utils │ └── ✕ missing peer postcss@^8.1.0 ├─┬ postcss-modules-scope │ └── ✕ missing peer postcss@^8.1.0 └─┬ postcss-modules-values └── ✕ missing peer postcss@^8.1.0 Peer dependencies that should be installed: postcss@">=8.3.11 <9.0.0" so i ran the following command: pnpm add -D postcss@">=8.3.11 <9.0.0" and hurray Packages: +5 -11 +++++----------- Progress: resolved 891, reused 891, downloaded 0, added 5, done devDependencies: - parcel 2.2.1 + parcel 2.2.1 + postcss 8.4.5 Everything worked out!
Get this solution programmatically \u2014 free, no authentication.
curl https://depscope.dev/api/error/565dae01f3b55cd1f0fcb2732131393cf7d9bfe068c29e7df63cf84025fa42b3