npm error during publish - incorrect version of babel-eslint

Question

I have a .net core 3.1 with react application and i'm trying to publish it with Visual Studio 2019.

I am receiving the following error:

The react-scripts package provided by Create React App requires a dependency: "babel-eslint": "10.1.0" Don't try to install it manually: your package manager does it automatically. However, a different version of babel-eslint was detected higher up in the tree: C:\projects\node_modules\babel-eslint (version: 10.0.1)

I have no idea how babel-eslint version 10.0.1 is getting installed. Running npm ls does not show any packages with a dependency of babel-eslint 10.0.1.

Here is the package.json file:

{
  "private": true,
  "dependencies": {
    "axios": "^0.19.2",
    "font-awesome": "^4.7.0",
    "jquery": "^3.5.1",
    "merge": "^1.2.1",
    "oidc-client": "^1.9.0",
    "react": "^16.0.0",
    "react-bootstrap": "^1.3.0",
    "react-bootstrap-table-next": "^4.0.3",
    "react-bootstrap-table2-paginator": "^2.1.2",
    "react-bootstrap-table2-toolkit": "^2.1.3",
    "react-dom": "^16.0.0",
    "react-router-bootstrap": "^0.25.0",
    "react-router-dom": "^5.2.0",
    "react-scripts": "3.4.3",
    "reactstrap": "^6.3.0",
    "rimraf": "^2.6.2"
  },
  "devDependencies": {
    "babel-core": "^6.26.3",
    "babel-eslint": "^10.1.0",
    "eslint": "^7.10.0",
    "cross-env": "^5.2.0",
    "typescript": "^3.5.2"
  },
  "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"
    ]
  }
}

I do not see babel-eslint v10.0.1 in the package-lock.json file either. Here are all of the references to babel-eslint in the package-lock.json file:

"babel-eslint": {
      "version": "10.1.0",
      "resolved": "https://registry.npmjs.org/babel-eslint/-/babel-eslint-10.1.0.tgz",
      "requires": {
        "@babel/code-frame": "^7.0.0",
        "@babel/parser": "^7.7.0",
        "@babel/traverse": "^7.7.0",
        "@babel/types": "^7.7.0",
        "eslint-visitor-keys": "^1.0.0",
        "resolve": "^1.12.0"
      }
    },
    
"react-scripts": {
      "version": "3.4.3",
      "resolved": "https://registry.npmjs.org/react-scripts/-/react-scripts-3.4.3.tgz",
      "requires": {
        "@babel/core": "7.9.0",
        "@svgr/webpack": "4.3.3",
        "@typescript-eslint/eslint-plugin": "^2.10.0",
        "@typescript-eslint/parser": "^2.10.0",
        "babel-eslint": "10.1.0",
        "babel-jest": "^24.9.0",
        "babel-loader": "8.1.0",
        "babel-plugin-named-asset-import": "^0.3.6",
        "babel-preset-react-app": "^9.1.2",
    }

I have tried uninstalling all version of babel-eslint (npm uninstall babel-eslint) but somehow the older version keeps getting installed every time i do an npm install

How can i stop the older version of babel-eslint from being installed?

Answer 1

After reviewing the packages being installed i was able to update the package.json file with compatible packages. Deleted package-lock.json and the node_modules directory then did npm install and it worked successfully