CODEWITHSUNDEEP
vue.jsnpmpeer-dependencies
sheldon_66
sheldon_66

Reputation: 83

NPM: npm peer dependency conflict

I download a project and it has no package-lock.json file.When I run npm install , there is conflict. The error message:

root@fb3391c63c7f:/app/avatar/avatar-h5# npm install --registry=https://registry.npm.taobao.org
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/vue
npm ERR!   vue@"2.6.10" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer vue@"3.0.5" from @vue/[email protected]
npm ERR! node_modules/@vue/compiler-sfc
npm ERR!   peer @vue/compiler-sfc@"^3.0.0-beta.14" from @vue/[email protected]
npm ERR!   node_modules/@vue/cli-service
npm ERR!     peer @vue/cli-service@"^3.0.0 || ^4.0.0-0" from @vue/[email protected]
npm ERR!     node_modules/@vue/cli-plugin-babel
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 /root/.npm/eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR!     /root/.npm/_logs/2021-01-18T21_53_07_044Z-debug.log

I read a lot docs and figure out that @vue/[email protected] will install lastest @vue/[email protected] . How can I install it compatible with [email protected]

package.json file

{
  "name": "avatar",
  "version": "3.2.0",

  "scripts": {
    "dev": "vue-cli-service serve",
    "build:prod": "vue-cli-service build",
    "build:stage": "vue-cli-service build --mode staging",
    "preview": "node build/index.js --preview",
    "lint": "eslint --ext .js,.vue src",
    "test:unit": "jest --clearCache && vue-cli-service test:unit",
    "test:ci": "npm run lint && npm run test:unit",
    "svgo": "svgo -f src/icons/svg --config=src/icons/svgo.yml",
    "new": "plop"
  },
  "husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
  },
  "lint-staged": {
    "src/**/*.{js,vue}": [
      "eslint --fix",
      "git add"
    ]
  },
  "keywords": [
    "vue",
    "admin",
    "dashboard",
    "element-ui",
    "boilerplate",
    "admin-template",
    "management-system"
  ],
  "repository": {
    "type": "git",
    "url": "https://gitee.com/fairyfleet/avatar.git"
  },
  "dependencies": {
    "@riophae/vue-treeselect": "0.4.0",
    "axios": "0.18.1",
    "clipboard": "2.0.4",
    "core-js": "3.6.5",
    "echarts": "4.2.1",
    "element-ui": "2.13.2",
    "file-saver": "2.0.1",
    "js-beautify": "1.10.2",
    "fuse.js": "3.4.4",
    "js-cookie": "2.2.0",
    "jsencrypt": "3.0.0-rc.1",
    "normalize.css": "7.0.0",
    "nprogress": "0.2.0",
    "path-to-regexp": "2.4.0",
    "screenfull": "4.2.0",
    "sortablejs": "1.8.4",
    "vue": "2.6.10",
    "vue-count-to": "1.0.13",
    "quill": "1.3.7",
    "vue-cropper": "0.4.9",
    "vue-router": "3.0.2",
    "vue-splitpane": "1.0.4",
    "vuedraggable": "2.20.0",
    "vuex": "3.1.0"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "4.4.4",
    "@vue/cli-plugin-eslint": "4.4.4",
    "@vue/cli-plugin-unit-jest": "4.4.4",
    "@vue/cli-service": "4.4.4",
    "@vue/test-utils": "1.0.0-beta.29",
    "autoprefixer": "9.5.1",
    "babel-eslint": "10.1.0",
    "babel-jest": "23.6.0",
    "babel-plugin-dynamic-import-node": "2.3.3",
    "chalk": "2.4.2",
    "chokidar": "2.1.5",
    "connect": "3.6.6",
    "eslint": "6.7.2",
    "eslint-plugin-vue": "6.2.2",
    "html-webpack-plugin": "3.2.0",
    "husky": "1.3.1",
    "lint-staged": "8.1.5",
    "mockjs": "1.0.1-beta3",
    "plop": "2.3.0",
    "runjs": "4.3.2",
    "node-sass": "4.14.1",
    "sass-loader": "8.0.2",
    "script-ext-html-webpack-plugin": "2.1.3",
    "script-loader": "0.7.2",
    "serve-static": "1.13.2",
    "svg-sprite-loader": "4.1.3",
    "svgo": "1.2.0",
    "vue-template-compiler": "2.6.10"
  },
  "engines": {
    "node": ">=8.9",
    "npm": ">= 3.0.0"
  },
  "browserslist": [
    "> 1%",
    "last 2 versions"
  ]
}

Upvotes: 7

Views: 23155

Answers (4)

Promise Preston
Promise Preston

Reputation: 28800

To add to Chaim Zonnenberg

I encountered this error when working on a NestJS project on macOS with Node (16.11.1) and npm (8.0.0).

When I run the command npm install I get the error below:

npm WARN old lockfile 
npm WARN old lockfile The package-lock.json file was created with an old version of npm,
npm WARN old lockfile so supplemental metadata must be fetched from the registry.
npm WARN old lockfile 
npm WARN old lockfile This is a one-time fix-up, please be patient...
npm WARN old lockfile 
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR! 
npm ERR! While resolving: [email protected]
npm ERR! Found: [email protected]
npm ERR! node_modules/rxjs
npm ERR!   rxjs@"^6.0.0" from the root project
npm ERR!   peer rxjs@"^6.0.0 || ^7.0.0" from @nestjs/[email protected]
npm ERR!   node_modules/@nestjs/axios
npm ERR!     @nestjs/axios@"^0.0.1" from the root project
npm ERR!   4 more (@nestjs/common, @nestjs/core, @nestjs/config, @nestjs/microservices)
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! elastic-apm-nest@"0.0.7" from the root project
npm ERR! 
npm ERR! Conflicting peer dependency: [email protected]
npm ERR! node_modules/rxjs
npm ERR!   peer rxjs@"^6.0.0" from [email protected]
npm ERR!   node_modules/elastic-apm-nest
npm ERR!     elastic-apm-nest@"0.0.7" 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.

Here's how I fixed it:

The issue was that I was running a newer version of Node (16.11.1) which was not the long term support (lts) version.

First, I removed the node package that was present on my macOS using the homebrew command:

brew uninstall --ignore-dependencies node

And then I installed nvm using homebrew:

brew install nvm

Next, I created the NVM's working directory since it didn't exist:

mkdir ~/.nvm

Next, I added the following to the ~/.zshrc file or your desired shell configuration file. For me the ~/.zshrc file did not exist so I created it using the command touch ~/.zshrc, and then opened it using the command:

nano ~/.zshrc

and added the following below:

export NVM_DIR="$HOME/.nvm"
[ -s "/usr/local/opt/nvm/nvm.sh" ] && . "/usr/local/opt/nvm/nvm.sh"  # This loads nvm
[ -s "/usr/local/opt/nvm/etc/bash_completion.d/nvm" ] && . "/usr/local/opt/nvm/etc/bash_completion.d/nvm"  # This loads nvm bash_completion

Save the file using the key combinations Ctrl + X and then Y and the ENTER.

Next, open a new terminal, and install Node LTS version using the command:

nvm install --lts

If you already have the Node LTS version installed then run the command:

nvm use --lts

Confirm your Node and npm versions using the command:

node --version
npm --version

Finally, run the npm install command again, and this time everything will go fine.

Upvotes: 0

Ling
Ling

Reputation: 1

npm install -g [email protected]

this also works on windows.

Upvotes: -3

Carver
Carver

Reputation: 109

What fixed this issue for me was simply removing the node_modules folder and then pasting the package versions in the package json file and running npm install.

Upvotes: 0

Chaim Zonnenberg
Chaim Zonnenberg

Reputation: 1823

Same issue here. It occurs only on newer versions of npm. You can temporarily fix it by falling back on the LTS 14.15 version of NodeJS.

On Linux/MacOS:

nvm use --lts

Or else:

npm install -g [email protected]

Upvotes: 10

Related Questions