peer dependency conflict when creating projects using vue 3 with babel on npm 8

[nicotu01]

Version

5.0.8

Environment info

Environment Info:

  System:
    OS: Linux 5.4 Ubuntu 20.04.2 LTS (Focal Fossa)
    CPU: (8) x64 Intel(R) Core(TM) i5-10310U CPU @ 1.70GHz
  Binaries:
    Node: 14.18.2 - ~/.nvm/versions/node/v14.18.2/bin/node
    Yarn: 1.22.17 - ~/.nvm/versions/node/v14.18.2/bin/yarn
    npm: 8.13.2 - ~/.nvm/versions/node/v14.18.2/bin/npm
  Browsers:
    Chrome: 102.0.5005.115
    Firefox: 89.0.2
  npmPackages:
    @vue/babel-helper-vue-jsx-merge-props:  1.2.1 
    @vue/babel-helper-vue-transform-on:  1.0.2 
    @vue/babel-plugin-jsx:  1.1.1 
    @vue/babel-plugin-transform-vue-jsx:  1.2.1 
    @vue/babel-preset-app:  5.0.8 
    @vue/babel-preset-jsx:  1.3.0 
    @vue/babel-sugar-composition-api-inject-h:  1.3.0 
    @vue/babel-sugar-composition-api-render-instance:  1.3.0 
    @vue/babel-sugar-functional-vue:  1.2.2 
    @vue/babel-sugar-inject-h:  1.2.2 
    @vue/babel-sugar-v-model:  1.3.0 
    @vue/babel-sugar-v-on:  1.3.0 
    @vue/cli-overlay:  5.0.8 
    @vue/cli-plugin-babel: ~5.0.0 => 5.0.8 
    @vue/cli-plugin-eslint: ~5.0.0 => 5.0.8 
    @vue/cli-plugin-router:  5.0.8 
    @vue/cli-plugin-vuex:  5.0.8 
    @vue/cli-service: ~5.0.0 => 5.0.8 
    @vue/cli-shared-utils:  5.0.8 
    @vue/compiler-core:  3.2.37 
    @vue/compiler-dom:  3.2.37 
    @vue/compiler-sfc:  3.2.37 
    @vue/compiler-ssr:  3.2.37 
    @vue/component-compiler-utils:  3.3.0 
    @vue/reactivity:  3.2.37 
    @vue/reactivity-transform:  3.2.37 
    @vue/runtime-core:  3.2.37 
    @vue/runtime-dom:  3.2.37 
    @vue/server-renderer:  3.2.37 
    @vue/shared:  3.2.37 
    @vue/web-component-wrapper:  1.3.0 
    eslint-plugin-vue: ^8.0.3 => 8.7.1 
    vue: ^3.2.13 => 3.2.37 
    vue-eslint-parser:  8.3.0 
    vue-hot-reload-api:  2.3.4 
    vue-loader:  17.0.0 (15.10.0)
    vue-style-loader:  4.1.3 
    vue-template-es2015-compiler:  1.9.1 
  npmGlobalPackages:
    @vue/cli: 5.0.8

Steps to reproduce

Install npm version 8
npm i -g npm@8

Run
vue create project_name

Select
❯ Default ([Vue 3] babel, eslint)

Then
cd project_name && npm i

What is expected?

Install without warnings

What is actually happening?

npm WARN ERESOLVE overriding peer dependency
npm WARN While resolving: @vue/[email protected]
npm WARN Found: [email protected]
npm WARN node_modules/vue
npm WARN   vue@"^3.2.13" from the root project
npm WARN   2 more (@vue/babel-preset-app, @vue/server-renderer)
npm WARN 
npm WARN Could not resolve dependency:
npm WARN peerOptional vue@"2.x" from @vue/[email protected]
npm WARN node_modules/@vue/babel-preset-jsx
npm WARN   @vue/babel-preset-jsx@"^1.1.2" from @vue/[email protected]
npm WARN   node_modules/@vue/babel-preset-app
npm WARN 
npm WARN Conflicting peer dependency: [email protected]
npm WARN node_modules/vue
npm WARN   peerOptional vue@"2.x" from @vue/[email protected]
npm WARN   node_modules/@vue/babel-preset-jsx
npm WARN     @vue/babel-preset-jsx@"^1.1.2" from @vue/[email protected]
npm WARN     node_modules/@vue/babel-preset-app

up to date, audited 944 packages in 3s

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

found 0 vulnerabilities

[sonicoder86]

Upgrading to Npm 9 doesn't solve the issue and it is still one.

[sonicoder86]

You have to downgrade to Npm 6 and it works...Node 14 has it by default

[melroy89]

for npm 7 see: #6270

Vue is just really a mess!! it's a mess people. you hear me devs?