[SOLVED] How can I fix a conflicting peer dependency without running npm install?

How can I fix a conflicting peer dependency without running npm install?

I have an old project that I created using create-react-app. I have a conflicting peer dependency regarding eslint that I've pasted below, along with my package.json. Running npm install isn't enough to fix it, so it seems I have to do it manually.

Could not resolve dependency:
peer @typescript-eslint/eslint-plugin@"2.x" from eslint-config-react-app@5.2.1
node_modules/eslint-config-react-app
  dev eslint-config-react-app@"^5.2.1" from the root project

Conflicting peer dependency: eslint@6.8.0
node_modules/eslint
  peer eslint@"^5.0.0 || ^6.0.0" from @typescript-eslint/eslint-plugin@2.34.0
  node_modules/@typescript-eslint/eslint-plugin
    peer @typescript-eslint/eslint-plugin@"2.x" from eslint-config-react-app@5.2.1
    node_modules/eslint-config-react-app
      dev eslint-config-react-app@"^5.2.1" from the root project

{
  "name": "xxxxx",
  "version": "x.x.x",
  "private": true,
  "dependencies": {
    "@codewell/super-search": "^1.0.0",
    "@emotion/react": "^11.4.1",
    "@emotion/styled": "^11.3.0",
    "@material-ui/core": "^4.12.3",
    "@material-ui/data-grid": "^4.0.0-alpha.37",
    "@mui/icons-material": "^5.0.1",
    "@mui/material": "^5.0.1",
    "@mui/x-data-grid": "^4.0.0",
    "ag-grid-community": "^26.0.0",
    "ag-grid-enterprise": "^26.0.1",
    "ag-grid-react": "^26.0.0",
    "axios": "^0.25.0",
    "bootstrap": "^5.1.1",
    "date-fns": "^2.25.0",
    "eslint-plugin": "^1.0.1",
    "eslint-plugin-react-hooks": "^4.6.0",
    "jquery": "^3.6.0",
    "merge": "^2.1.1",
    "oidc-client": "^1.9.0",
    "react": "^17.0.2",
    "react-bootstrap": "^2.0.0-rc.0",
    "react-date-range": "^1.4.0",
    "react-dom": "^17.0.2",
    "react-router-bootstrap": "^0.25.0",
    "react-router-dom": "^6.3.0",
    "react-scripts": "^5.0.1",
    "reactstrap": "^8.4.1",
    "rimraf": "^2.6.2",
    "serve": "^14.2.0"
  },
  "devDependencies": {
    "ajv": "^6.9.1",
    "cross-env": "^5.2.0",
    "eslint-config-react-app": "^5.2.1",
    "eslint-plugin-flowtype": "^4.6.0",
    "eslint-plugin-import": "^2.20.1",
    "eslint-plugin-jsx-a11y": "^6.2.3",
    "eslint-plugin-react": "^7.18.3",
    "nan": "^2.14.1",
    "typescript": "^3.7.5"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "scripts": {
    "start": "rimraf ./build && react-scripts start",
    "build": "react-scripts build",
    "test": "cross-env CI=true react-scripts test --env=jsdom",
    "eject": "react-scripts eject",
    "lint": "eslint ./src/"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

And here are the details of the package that I'd like to update to its latest version

"node_modules/eslint-config-react-app": {
      "version": "5.2.1",
      "resolved": "https://registry.npmjs.org/eslint-config-react-app/-/eslint-config-react-app-5.2.1.tgz",
      "integrity": "sha512-pGIZ8t0mFLcV+6ZirRgYK6RVqUIKRIi9MmgzUEmrIknsn3AdO0I32asO86dJgloHq+9ZPl8UIg8mYrvgP5u2wQ==",
      "dev": true,
      "dependencies": {
        "confusing-browser-globals": "^1.0.9"
      },
      "peerDependencies": {
        "@typescript-eslint/eslint-plugin": "2.x",
        "@typescript-eslint/parser": "2.x",
        "babel-eslint": "10.x",
        "eslint": "6.x",
        "eslint-plugin-flowtype": "3.x || 4.x",
        "eslint-plugin-import": "2.x",
        "eslint-plugin-jsx-a11y": "6.x",
        "eslint-plugin-react": "7.x",
        "eslint-plugin-react-hooks": "1.x || 2.x"
      }
    },

My thought process is that if I can update eslint-config-react-app, it'll no longer have dependent packages that don't work with the version of eslint I require. I've tried updating it to its latest version using --legacy-peer-deps, but that only updates the package(s) that's in node_modules/react_scripts.

My project has a ClientApp directory where I am trying to update these packages, and it's also where the package.json is. Is there a way of updating the package that's in just the node_modules folder?

Solution

I fixed it by typing in the latest version of eslint-config-react-app directly into my package.json, then deleting my node_modules folder and running npm install. I didn't know you could type in the packages, would've saved me a lot of time!