Why is Mock Service Worker not installed in React project with Typescript support?

user_19199800 0
Viewed 334

I want to include Mock Service Worker into my React project with Typescript support, but as soon as I run npm install msw --save-dev command, my terminal shows me these error messages:

PS F:\Programming\React Practices\ReactPizza\my-app> npm install msw --save-dev
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: msw@0.41.0
npm ERR! Found: typescript@4.7.2
npm ERR! node_modules/typescript
npm ERR!   peer typescript@">= 2.7" from fork-ts-checker-webpack-plugin@6.5.2
npm ERR!   node_modules/fork-ts-checker-webpack-plugin
npm ERR!     fork-ts-checker-webpack-plugin@"^6.5.0" from react-dev-utils@12.0.1
npm ERR!     node_modules/react-dev-utils
npm ERR!       react-dev-utils@"^12.0.1" from react-scripts@5.0.1
npm ERR!       node_modules/react-scripts
npm ERR!         react-scripts@"5.0.1" from the root project
npm ERR!   peerOptional typescript@"^3.2.1 || ^4" from react-scripts@5.0.1
npm ERR!   node_modules/react-scripts
npm ERR!     react-scripts@"5.0.1" from the root project
npm ERR!   2 more (tsutils, the root project)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peerOptional typescript@">= 4.2.x <= 4.6.x" from msw@0.41.0
npm ERR! node_modules/msw
npm ERR!   dev msw@"*" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: typescript@4.6.4
npm ERR! node_modules/typescript
npm ERR!   peerOptional typescript@">= 4.2.x <= 4.6.x" from msw@0.41.0
npm ERR!   node_modules/msw
npm ERR!     dev msw@"*" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR! See C:\Users\Win10\AppData\Local\npm-cache\eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\Win10\AppData\Local\npm-cache\_logs\2022-05-27T17_17_28_323Z-debug.log

I don't know what the matter is, and how to fix it. My mini-project is powered by create-react-app. I mean the project was started out with this:

npx create-react-app my-app --template typescript

When I don't utilize Typescript with npx create-react-app everything is going well.

You may easily check those error messages on GitHub:https://github.com/AlexKor-5/ReactPizzaApp_Ts/tree/5849bb4cb928550dcb4bfd66ecb8b7bf0757fb9f by an attempt to install MSW.

npm typescript reactjs node.js javascript
1 Answers

I can only assume you're using npm 7 (since npm 6 would automatically force install it). And it's telling you what the issue is, a conflicting peer dependency, typescript.

It's also telling you how to fix it:

Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps

Aka:

npm install --legacy-peer-deps

Otherwise reinstall a later/earlier version of either package so the peer dependencies can match up. Msw is using ">= 4.2.x <= 4.6.x" typescript and you have typescript@4.7.2 installed, it's breaking because msw doesn't accept your typescript version.

Admin1
Related