I have the following package.json file:

{
  "name": "web",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@emotion/react": "^11.10.0",
    "@emotion/styled": "^11.10.0",
    "@fontsource/roboto": "^4.5.7",
    "@mui/icons-material": "^5.8.4",
    "@mui/lab": "^5.0.0-alpha.93",
    "@mui/material": "^5.9.3",
    "@reduxjs/toolkit": "^1.8.3",
    "@testing-library/jest-dom": "^5.16.4",
    "@testing-library/react": "^13.3.0",
    "@testing-library/user-event": "^13.5.0",
    "animate.css": "^4.1.1",
    "generate-password-browser": "^1.1.0",
    "notistack": "^2.0.5",
    "query-string": "^7.1.1",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-redux": "^8.0.2",
    "react-router-dom": "^6.3.0",
    "react-scripts": "5.0.1",
    "string-to-color": "^2.2.2",
    "stylis-plugin-rtl": "^2.1.1",
    "traverse": "^0.6.6",
    "typed.js": "^2.0.12",
    "web-vitals": "^2.1.4"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

I have created this project using create-react-app just now, so everything is clean and new, I have only installed additional packages.

Now, I want to install the following package:

• react-swipeable-views

Which had over 260,000 downloads this week,

$ npm i react-swipeable-views

and I'm getting this error:

npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR! 
npm ERR! While resolving: [email protected]
npm ERR! Found: [email protected]
npm ERR! node_modules/react
npm ERR!   react@"^18.2.0" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer react@"^15.3.0 || ^16.0.0 || ^17.0.0" from [email protected]
npm ERR! node_modules/react-swipeable-views
npm ERR!   react-swipeable-views@"*" 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 /home/sam/.npm/eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/sam/.npm/_logs/2022-08-04T16_50_51_600Z-debug-0.log

Everything was working just fine before the idea of moving to react 18. Thanks react, now how do I fix this problem? I have tens of other dependencies which I'm unable to install because of this error, I was able to rescue the ones listed above in the package.json file, thank god.

If I wanted to roll back to react@17 I can't because there's no way you can do it since create-react-app does not have such an option, and if you npm un react and npm i react@17 the errors will remain because create-react-app installs other dependencies and not only react.

Any help to get out of this problem?

• • with explanation, why this is happening if possible