Dependency Error When Installing NPM Packages

Hi, Sorry if this is the wrong place for this but I’m trying to get started with Vuelidate and Vue 3 however when I try to install the packages I get a dependency error related to composition-api:

$ npm install @vuelidate/core @vuelidate/validators
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: app@0.1.0
npm ERR! Found: vue@3.0.4
npm ERR! node_modules/vue
npm ERR!   vue@"^3.0.0" from the root project
npm ERR!   peer vue@"^2.0.0 || >=3.0.0-rc.0" from @vuelidate/core@2.0.0-alpha.8
npm ERR!   node_modules/@vuelidate/core
npm ERR!     @vuelidate/core@"*" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer vue@">= 2.5 < 3" from @vue/composition-api@1.0.0-beta.22
npm ERR! node_modules/@vue/composition-api
npm ERR!   peer @vue/composition-api@"^1.0.0-beta.1" from @vuelidate/core@2.0.0-alpha.8
npm ERR!   node_modules/@vuelidate/core
npm ERR!     @vuelidate/core@"*" from the root project

I think I might be doing something wrong here but can’t find anything related to my problem online. Here is my package.json from my project:

{
  "name": "app",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "@azure/msal-browser": "^2.7.0",
    "axios": "^0.21.0",
    "core-js": "^3.6.5",
    "mitt": "^2.1.0",
    "primeflex": "^2.0.0",
    "primeicons": "^4.1.0",
    "primevue": "^3.0.2",
    "vue": "^3.0.0",
    "vue-router": "^4.0.0-rc.5",
    "vuex": "^4.0.0-rc.2"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "~4.5.0",
    "@vue/cli-plugin-eslint": "~4.5.0",
    "@vue/cli-service": "~4.5.0",
    "@vue/compiler-sfc": "^3.0.0",
    "babel-eslint": "^10.1.0",
    "eslint": "^6.7.2",
    "eslint-plugin-vue": "^7.0.0-0",
    "node-sass": "^5.0.0",
    "sass-loader": "^10.1.0"
  },
  "eslintConfig": {
    "root": true,
    "env": {
      "node": true
    },
    "extends": [
      "plugin:vue/vue3-essential",
      "eslint:recommended"
    ],
    "parserOptions": {
      "parser": "babel-eslint"
    },
    "rules": {}
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not dead"
  ]
}

I’m not sure what I’m missing here. Any help pointing me in the right direction is appreciated.

[rwparris2]

Same problem.

I’ve discovered this issue only occurs with newer versions of npm.

It can be easily reproduced by swapping node versions via nvm, then creating an app using the default vue3 preset from the vue cli and attempting to install vuelidate.

LTS version of npm, this works fine

~/projects ❯ nvm use --lts
Now using node v14.15.3 (npm v6.14.9)
~/projects ❯ vue -V                                                                                                                   
@vue/cli 4.5.9
~/projects ❯ vue create vuelidate-test-lts -p __default_vue_3__                                                                       
~/projects ❯ cd vuelidate-test-lts                                                                                                            
~/projects/vuelidate-test-lts master ❯ npm install @vuelidate/core @vuelidate/validators            

npm WARN @vuelidate/core@2.0.0-alpha.8 requires a peer of @vue/composition-api@^1.0.0-beta.1 but none is installed. You must install peer dependencies yourself.
npm WARN @vuelidate/validators@2.0.0-alpha.5 requires a peer of @vue/composition-api@^1.0.0-beta.1 but none is installed. You must install peer dependencies yourself.

+ @vuelidate/core@2.0.0-alpha.8
+ @vuelidate/validators@2.0.0-alpha.5
added 1 package, updated 1 package and audited 1327 packages in 5.785s

69 packages are looking for funding
  run `npm fund` for details

found 0 vulnerabilities

Latest version of NPM, vuelidate won’t install

~/projects ❯ nvm use node                                                 
Now using node v15.5.0 (npm v7.3.0)
~/projects ❯ vue -V                                                                                   
@vue/cli 4.5.9
~/projects ❯ vue create vuelidate-test-latest -p __default_vue_3__
~/projects ❯ cd vuelidate-test-latest 
~/projects/vuelidate-test-latest master ❯ npm install @vuelidate/core @vuelidate/validators            
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR! 
npm ERR! While resolving: vuelidate-test-latest@0.1.0
npm ERR! Found: vue@3.0.5
npm ERR! node_modules/vue
npm ERR!   vue@"^3.0.0" from the root project
npm ERR!   peer vue@"^2.0.0 || >=3.0.0-rc.0" from @vuelidate/core@2.0.0-alpha.8
npm ERR!   node_modules/@vuelidate/core
npm ERR!     @vuelidate/core@"*" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer vue@">= 2.5 < 3" from @vue/composition-api@1.0.0-beta.22
npm ERR! node_modules/@vue/composition-api
npm ERR!   peer @vue/composition-api@"^1.0.0-beta.1" from @vuelidate/core@2.0.0-alpha.8
npm ERR!   node_modules/@vuelidate/core
npm ERR!     @vuelidate/core@"*" 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 /Users/robertparris/.npm/eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/robertparris/.npm/_logs/2020-12-31T01_56_14_018Z-debug.log

[dobromir-hristov]

Should be fixed now.