search

vuejs / vue-cli

🛠️ webpack-based tooling for Vue.js Development
https://cli.vuejs.org/
MIT License
29.78k stars 6.33k forks source link

peer dependency confilct when creating projects using vue 2 on npm 7 #6270

Closed yrccondor closed 3 years ago

yrccondor commented 3 years ago

Version

4.5.11

Environment info

 System:
    OS: Linux 5.4 Ubuntu 18.04.4 LTS (Bionic Beaver)
    CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz
  Binaries:
    Node: 12.17.0 - /usr/local/bin/node
    Yarn: 1.22.5 - /usr/bin/yarn
    npm: 7.5.2 - ~/npm-global/bin/npm
  Browsers:
    Chrome: Not Found
    Firefox: Not Found
  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.0.3
    @vue/babel-plugin-transform-vue-jsx:  1.2.1
    @vue/babel-preset-app:  4.5.11
    @vue/babel-preset-jsx:  1.2.4
    @vue/babel-sugar-composition-api-inject-h:  1.2.1
    @vue/babel-sugar-composition-api-render-instance:  1.2.4
    @vue/babel-sugar-functional-vue:  1.2.2
    @vue/babel-sugar-inject-h:  1.2.2
    @vue/babel-sugar-v-model:  1.2.3
    @vue/babel-sugar-v-on:  1.2.3
    @vue/cli-overlay:  4.5.11
    @vue/cli-plugin-babel: ~4.5.0 => 4.5.11
    @vue/cli-plugin-eslint: ~4.5.0 => 4.5.11
    @vue/cli-plugin-router:  4.5.11
    @vue/cli-plugin-vuex:  4.5.11
    @vue/cli-service: ~4.5.0 => 4.5.11
    @vue/cli-shared-utils:  4.5.11
    @vue/component-compiler-utils:  3.2.0
    @vue/preload-webpack-plugin:  1.1.2
    @vue/web-component-wrapper:  1.2.0
    eslint-plugin-vue: ^6.2.2 => 6.2.2
    vue: ^2.6.11 => 2.6.12
    vue-eslint-parser:  7.4.1
    vue-hot-reload-api:  2.3.4
    vue-loader:  15.9.6 (16.1.2)
    vue-style-loader:  4.1.2
    vue-template-compiler: ^2.6.11 => 2.6.12
    vue-template-es2015-compiler:  1.9.1
  npmGlobalPackages:
    @vue/cli: 4.5.11

Steps to reproduce

Run

vue create project_name

to create a vue project and then choose vue 2. Then

cd project_name && npm update

What is expected?

Dependencies updated

What is actually happening?

receive an error says "ERESOLVE unable to resolve dependency tree"

Detail:

$ npm update         
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR! 
npm ERR! While resolving: project_name@0.1.0
npm ERR! Found: vue@2.6.12
npm ERR! node_modules/vue
npm ERR!   vue@"^2.6.11" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer vue@"3.0.5" from @vue/compiler-sfc@3.0.5
npm ERR! node_modules/@vue/compiler-sfc
npm ERR!   peerOptional @vue/compiler-sfc@"^3.0.0-beta.14" from @vue/cli-service@4.5.11
npm ERR!   node_modules/@vue/cli-service
npm ERR!     dev @vue/cli-service@"~4.5.0" from the root project
npm ERR!     1 more (@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.

peerDependenciesMeta used in @vue/cli-service causes unexpected behavior on npm 7

Nyanng commented 3 years ago

+1

gilles-crealp commented 3 years ago

Same problem when I try to install / update any Vue scoped package (@vue/) with npm 7.5.3 & node 12.20.1.

bauer00 commented 3 years ago

I have the same problem with Node 15.8.0 (npm 7.5.1) but it works with Node 15.6.0 (npm 7.4.0).

marziply commented 3 years ago

+1 I'm experiencing this too, I've tried with Node 14.15.4, 14.15.5, 15.6.0, and 15.8.0, running them all on npm 7.5.1.

foxted commented 3 years ago

npm i --legacy-peer-deps fixed it for me

cnakamoto commented 3 years ago

+1 this is very frustrating

cnakamoto commented 3 years ago

It also happens when you just try to npm i @vue/cli-service on a project that is running Vue v2.x, even if you try to ignore optional peer dependancies. Switching back to an older npm version solves the issue (sudo npm install -g npm@6.14.8)

foxted commented 3 years ago

Just curious, @cnakamoto did you try with adding the --legacy-peer-deps flag on npm install?

cnakamoto commented 3 years ago

Yes, I saw that afterwards and it worked on my Mac and also on my Windows machine - thanks.

gbirke commented 3 years ago

Same here on node 15.10.0 and npm 7.5.3

Using --legacy-peer-deps is a workaround that will downgrade all peer dependencies, omitting a log of bug fixes. While this technically "works", it's still bad. Could we get a release of vue-cli 4.x that does not depend on vue 3?

sodatea commented 3 years ago

I believe this issue has been resolved in npm 7.5.5. https://github.com/npm/cli/issues/2615

yrccondor commented 3 years ago

confirm it's working on npm 7.6.0

sinabeuro commented 3 years ago

it's not working on npm 7.7.6..

dpanse commented 3 years ago

Not working on 7.6.0:

MacBook-Pro>> npm update
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR! 
npm ERR! While resolving: xxxx-xxxxxxxxxx@0.1.0
npm ERR! Found: eslint@7.14.0
npm ERR! node_modules/eslint
npm ERR!   dev eslint@"7.14.0" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer eslint@">= 1.6.0 < 7.0.0" from @vue/cli-plugin-eslint@4.5.11
npm ERR! node_modules/@vue/cli-plugin-eslint
npm ERR!   dev @vue/cli-plugin-eslint@"4.5.11" 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/xxxxxxxxxx/.npm/eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/xxxxxxxxxx/.npm/_logs/2021-04-01T22_38_45_996Z-debug.log

MacBook-Pro blip % npm --version
7.6.0
0LING0 commented 3 years ago

It also happens when you just try to npm i @vue/cli-service on a project that is running Vue v2.x, even if you try to ignore optional peer dependancies. Switching back to an older npm version solves the issue (sudo npm install -g npm@6.14.8)

npm install -g npm@6.14.8 this also work on windows.

throrin19 commented 3 years ago

It's no working with npm 7.10. To works we have to set the legacy-peer-deps flag and it's not normal...

skytodmoon commented 3 years ago

It's no working with npm 7.11.

sodatea commented 3 years ago

@dpanse ESLint 7 is only supported in Vue CLI v5.0.0-beta. That's expected.

wangxdmm commented 3 years ago

npm 7.12.1 is ok.

xinple commented 3 years ago

Not working on npm@7.13.0

➜ npm update
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: project@1.0.1
npm ERR! Found: vue@2.6.12
npm ERR! node_modules/vue
npm ERR!   vue@"^2.6.11" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer vue@"3.0.11" from @vue/compiler-sfc@3.0.11
npm ERR! node_modules/@vue/compiler-sfc
npm ERR!   peer @vue/compiler-sfc@"^3.0.0-beta.14" from @vue/cli-service@4.5.13
npm ERR!   node_modules/@vue/cli-service
npm ERR!     dev @vue/cli-service@"^4.5.11" from the root project
npm ERR!     1 more (@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.
ldsenow commented 3 years ago

npm 7.16.0 not working neither

dlordi commented 3 years ago

npm 7.19.1 not working

Kenvdb commented 2 years ago

npm 7.20.3 not working either, tried "--legacy-peer-deps" and "fix --force", both results in the following error.

➜ npm audit fix

npm ERR! code ERESOLVE npm ERR! ERESOLVE could not resolve npm ERR! npm ERR! While resolving: @vue/cli-plugin-eslint@4.5.13 npm ERR! Found: eslint@7.32.0 npm ERR! node_modules/eslint npm ERR! eslint@"*" from the root project npm ERR! peer eslint@"^7.12.1" from @vue/eslint-config-standard@6.1.0 npm ERR! node_modules/@vue/eslint-config-standard npm ERR! dev @vue/eslint-config-standard@"^6.1.0" from the root project npm ERR! 9 more (eslint-config-standard, babel-eslint, ...) npm ERR! npm ERR! Could not resolve dependency: npm ERR! peer eslint@">= 1.6.0 < 7.0.0" from @vue/cli-plugin-eslint@4.5.13 npm ERR! node_modules/@vue/cli-plugin-eslint npm ERR! dev @vue/cli-plugin-eslint@"^4.5.13" from the root project npm ERR! npm ERR! Conflicting peer dependency: eslint@6.8.0 npm ERR! node_modules/eslint npm ERR! peer eslint@">= 1.6.0 < 7.0.0" from @vue/cli-plugin-eslint@4.5.13 npm ERR! node_modules/@vue/cli-plugin-eslint npm ERR! dev @vue/cli-plugin-eslint@"^4.5.13" 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.

Does anyone knows a fix for this without downgrading NPM?

sodatea commented 2 years ago

Don't use ESLint 7 with Vue CLI 4.

You can use ESLint 7 with Vue CLI 5, or ESLint 6 with Vue CLI 4.

Kenvdb commented 2 years ago

Don't use ESLint 7 with Vue CLI 4.

You can use ESLint 7 with Vue CLI 5, or ESLint 6 with Vue CLI 4.

Thanks for your reply!

I've tried to downgrade, but still no luck in my setup unfortunately. It results in multiple errors for ESLint dependencies. What ESLint (cli-plugin-eslint, eslint-config-standard) versions should I use for Vue CLI 4.5.4?

"@vue/cli-plugin-babel": "^4.5.4", "@vue/cli-plugin-eslint": "^4.5.4", "@vue/cli-service": "^4.5.4", "@vue/eslint-config-standard": "^5.1.2", "babel-eslint": "^10.1.0", "eslint": "^7.7.0", "eslint-config-standard": "^14.1.1", "eslint-plugin-import": "^2.22.0", "eslint-plugin-node": "^11.1.0", "eslint-plugin-promise": "^4.2.1", "eslint-plugin-standard": "^4.0.1", "eslint-plugin-vue": "^7.0.1",

ghost commented 2 years ago

Still having this issue when using npm audit fix.

npm 8.0.0 vue cli 4.5.13 eslint 6.8.0

$ npm audit fix
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR! 
npm ERR! While resolving: @vue/cli-plugin-eslint@4.5.13
npm ERR! Found: eslint@6.8.0
npm ERR! node_modules/eslint
npm ERR!   dev eslint@"^6.7.2" from the root project
npm ERR!   peer eslint@">= 1.6.0 < 7.0.0" from @vue/cli-plugin-eslint@4.5.13
npm ERR!   node_modules/@vue/cli-plugin-eslint
npm ERR!     dev @vue/cli-plugin-eslint@"~4.5.0" from the root project
npm ERR!   4 more (babel-eslint, eslint-loader, eslint-plugin-vue, vue-eslint-parser)
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer eslint@">= 1.6.0 < 7.0.0" from @vue/cli-plugin-eslint@4.5.13
npm ERR! node_modules/@vue/cli-plugin-eslint
npm ERR!   dev @vue/cli-plugin-eslint@"~4.5.0" from the root project
npm ERR! 
npm ERR! Conflicting peer dependency: eslint@4.4.1
npm ERR! node_modules/eslint
npm ERR!   peer eslint@">= 1.6.0 < 7.0.0" from @vue/cli-plugin-eslint@4.5.13
npm ERR!   node_modules/@vue/cli-plugin-eslint
npm ERR!     dev @vue/cli-plugin-eslint@"~4.5.0" 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
├── @vue/cli-plugin-babel@4.5.13
├── @vue/cli-plugin-eslint@4.5.13
├── @vue/cli-plugin-router@4.5.13
├── @vue/cli-service@4.5.13
├── babel-eslint@10.1.0
├── bindings@1.5.0 extraneous
├── core-js@3.18.2
├── eslint-plugin-vue@6.2.2
├── eslint@6.8.0
├── file-uri-to-path@1.0.0 extraneous
├── nan@2.15.0 extraneous
├── sass-loader@10.2.0
├── sass@1.32.13
├── vue-cli-plugin-vuetify@2.4.3
├── vue-router@3.5.2
├── vue-template-compiler@2.6.14
├── vue@2.6.14
├── vuetify-loader@1.7.3
└── vuetify@2.5.9
melroy89 commented 2 years ago

I created a new Vue project from scratch. I also have audit issues. which can't be solved via npm audit fix, due to version conflicts.

Using Node LTS, which is NodeJS v16.13 and NPM v8.1.

  "dependencies": {
    "core-js": "^3.6.5",
    "vue": "^3.0.0"
  },
  "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"
  },

This is my first experience with VueJs...

NathanAP commented 2 years ago

I'm sorry, but why is this issue closed? It is NOT resolved. I just created a new project with VueCli and I can't run npm audit fix.

melroy89 commented 2 years ago

Yea you are right. Npm audit is failing. But not resulting into security issues at the end user.

I talked with the nice devs of vuejs in discord. They sent me the following article. Please, I urge you to read it:

https://overreacted.io/npm-audit-broken-by-design/

Tldr: you just need to read the article.

CtrlDot commented 2 years ago

That article is complete bunk. Multiple attack vectors are considered when creating/assigning risk ratings. If the author doesn't understand that, that shouldn't lead you to making bad security decisions.

AllisonPedro commented 2 years ago

vue ui deixa a instalação mais fácil.

ldsleticia commented 2 years ago

Hello :)

npm 8.8.0 not working

npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree npm ERR! npm ERR! While resolving: wdev-site@0.1.0 npm ERR! Found: vue@2.6.14 npm ERR! node_modules/vue npm ERR! vue@"^2.6.14" from the root project npm ERR! npm ERR! Could not resolve dependency: npm ERR! peer vue@"^3.2.0" from vue-router@4.0.14 npm ERR! node_modules/vue-router npm ERR! vue-router@"^4.0.14" 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 /home/leticia/.npm/eresolve-report.txt for a full report.

I tried with --force and also with --legacy-peer-deps and it kept "broken"

abisayo commented 1 year ago

npm i --legacy-peer-deps fixed it for me

Life saver

anshupitlia-tw commented 1 year ago

npm: '9.6.1', not working

rayanmarcus commented 1 year ago

I had the same problem when i tried install axios or any other. npm version: 8.19.3 node version: v18.13.0

npm ERR! code ERESOLVE npm ERR! ERESOLVE could not resolve npm ERR! npm ERR! While resolving: @vue/eslint-config-standard@6.1.0 npm ERR! Found: eslint-plugin-vue@8.7.1 npm ERR! node_modules/eslint-plugin-vue npm ERR! dev eslint-plugin-vue@"^8.0.3" from the root project npm ERR! npm ERR! Could not resolve dependency: npm ERR! peer eslint-plugin-vue@"^7.0.0" from @vue/eslint-config-standard@6.1.0 npm ERR! node_modules/@vue/eslint-config-standard npm ERR! dev @vue/eslint-config-standard@"^6.1.0" from the root project npm ERR! npm ERR! Conflicting peer dependency: eslint-plugin-vue@7.20.0 npm ERR! node_modules/eslint-plugin-vue npm ERR! peer eslint-plugin-vue@"^7.0.0" from @vue/eslint-config-standard@6.1.0 npm ERR! node_modules/@vue/eslint-config-standard npm ERR! dev @vue/eslint-config-standard@"^6.1.0" 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`

For me was resolve using --legacy-peer-deps or --force

pprathameshmore commented 1 year ago

Having the same issue.

npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR! 
npm ERR! While resolving: test-cli@0.1.0
npm ERR! Found: @vue/cli-service@5.0.8
npm ERR! node_modules/@vue/cli-service
npm ERR!   dev @vue/cli-service@"^5.0.7" from the root project
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer @vue/cli-service@"^3.0.0 || ^4.0.0-0" from @vue/cli-plugin-eslint@4.5.19
npm ERR! node_modules/@vue/cli-plugin-eslint
npm ERR!   dev @vue/cli-plugin-eslint@"~4.5.0" 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.
melroy89 commented 1 year ago

According to the README file:

Vue CLI is now in maintenance mode. For new projects, please use create-vue to scaffold Vite-based projects. create-vue supports both Vue 2 and Vue 3.

Bazzly commented 8 months ago

This might help someone This is how I solve the issue of my npm dependency conflicts: I look at the conflict error message and update it to the latest version.

npm install --legacy-peer-deps vite@latest
npm install --legacy-peer-deps @vitejs/plugin-vue@latest
npm install --legacy-peer-deps laravel-vite-plugin@latest

That works for me

yogithesymbian commented 8 months ago

#EDIT : solved by using --force instead of --legacy-peer-deps and using old version of node@12

i have solved by --legacy-peer-deps BUT ITS BROKEN styling , hope someone help me :( . but its break my styling after npm run start , the navbar is gone ,, and its failed when call sockjs-node ( dunno what is this network for) . i accident by remove node_modules and i was switch my node version from 12 to 18. i use homebrew, but on brew list node there is node package again for version 12 so i use nvm instead for install version 12

  1. so i have version 14, 18, and 21 from homebrew
  2. version 12 from nvm install 12

my old projects required version 12 only . i have test with version 18 its run but break styling , navbar is gone. i install npm with --legacy-peer-deps without the properties i got an error for eslint@6.8.0. also i have tried version 7.3.2 for the eslint . but still have same issue .

all of my field get

[Vue warn]: Property or method "skinClasses" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property. See: https://v2.vuejs.org/v2/guide/reactivity.html#Declaring-Reactive-Properties.

found in

i never touch anything ... and there is no change on commit . its run normal on yesterday before i switch my node version and not delete my node_modules.

npm -v       
9.8.1

node -v
v18.18.2

my zshrc

# export PATH="/opt/homebrew/opt/node@12/bin:$PATH" // i cant use this version again , there is no found on brew again , i think brew has delete this version so i cant install from brew . only version 14 can install
# export PATH="/opt/homebrew/opt/node@14/bin:$PATH"
# export PATH="/opt/homebrew/opt/node/bin:$PATH"
 export PATH="/opt/homebrew/opt/node@18/bin:$PATH"
# export PATH="/usr/local/bin/node/bin:$PATH"
# export NVM_DIR="$HOME/.nvm" // so i use nvm instead for version 12
#  [ -s "/opt/homebrew/opt/nvm/nvm.sh" ] && \. "/opt/homebrew/opt/nvm/nvm.sh"  # This loads nvm
#  [ -s "/opt/homebrew/opt/nvm/etc/bash_completion.d/nvm" ] && \. "/opt/homebrew/opt/nvm/etc/bash_completion.d/nvm"  # This loads nvm bash_completion

here is my full package.json

{
  "name": "yogiarifwidodo-xxx-xxx-xxx-xx-xx",
  "version": "15.9.12",
  "private": true,
  "scripts": {
    "build": "vue-cli-service build",
    "build:development": "vue-cli-service build --mode development",
    "start": "vue-cli-service serve",
    "start:production": "vue-cli-service serve --mode production",
    "lint": "vue-cli-service lint",
    "clean": "rm -rf node_modules"
  },
  "engines": {
    "node": "14.x",
    "npm": "6.x"
  },
  "dependencies": {
    "@casl/ability": "4.1.6",
    "@casl/vue": "1.1.1",
    "@fullcalendar/common": "5.x",
    "@fullcalendar/core": "5.x",
    "@fullcalendar/daygrid": "5.x",
    "@fullcalendar/interaction": "5.x",
    "@fullcalendar/list": "5.x",
    "@fullcalendar/timegrid": "5.x",
    "@fullcalendar/vue": "5.x",
    "@vue/composition-api": "^1.3.0",
    "@vueuse/core": "4.0.0",
    "animate.css": "4.1.1",
    "apexcharts": "3.23.0",
    "axios": "0.21.1",
    "axios-mock-adapter": "1.19.0",
    "bootstrap": "4.6.0",
    "bootstrap-vue": "2.21.1",
    "chart.js": "2.9.4",
    "choices.js": "^10.1.0",
    "compression-webpack-plugin": "^6.1.1",
    "core-js": "3.8.1",
    "dotenv": "^10.0.0",
    "echarts": "4.8.0",
    "file-saver": "^2.0.5",
    "firebase": "^8.2.10",
    "flatpickr": "^4.6.9",
    "gsap": "^3.11.4",
    "jquery": "^3.6.3",
    "jsonwebtoken": "8.5.1",
    "leaflet": "1.6.0",
    "lottie-vuejs": "^0.4.0",
    "moment": "^2.29.1",
    "portal-vue": "2.1.7",
    "postcss-loader": "^3.0.0",
    "postcss-rtl": "1.7.3",
    "prismjs": "1.19.0",
    "pusher-js": "^7.3.0",
    "raw-loader": "^0.5.1",
    "style-loader": "^1.3.0",
    "swiper": "5.4.5",
    "uuid": "^8.3.2",
    "vee-validate": "^3.4.14",
    "vue": "2.x",
    "vue-3d-model": "^1.4.1",
    "vue-apexcharts": "1.6.0",
    "vue-autosuggest": "2.2.0",
    "vue-awesome-swiper": "4.1.1",
    "vue-chartjs": "3.5.0",
    "vue-cleave-component": "2.1.3",
    "vue-clipboard2": "0.3.1",
    "vue-context": "6.0.0",
    "vue-currency-input": "^2.4.0",
    "vue-disable-autocomplete": "0.0.4",
    "vue-echarts": "5.0.0-beta.0",
    "vue-feather-icons": "5.1.0",
    "vue-flatpickr-component": "8.1.6",
    "vue-form-wizard": "0.8.4",
    "vue-good-table": "2.21.0",
    "vue-i18n": "8.22.2",
    "vue-meta": "^2.4.0",
    "vue-perfect-scrollbar": "0.2.1",
    "vue-prism-component": "1.1.1",
    "vue-quill-editor": "3.0.6",
    "vue-ripple-directive": "2.0.1",
    "vue-router": "3.4.9",
    "vue-select": "^3.11.2",
    "vue-slider-component": "3.2.11",
    "vue-suggestion": "^2.0.0",
    "vue-sweetalert2": "4.1.1",
    "vue-toastification": "1.7.11",
    "vue-tour": "1.5.0",
    "vue-tree-halower": "1.8.3",
    "vue2-dropzone": "^3.6.0",
    "vue2-leaflet": "2.5.2",
    "vuedraggable": "2.24.3",
    "vuex": "3.6.0"
  },
  "devDependencies": {
    "@babel/plugin-proposal-optional-chaining": "^7.20.7",
    "@volar-plugins/vetur": "^0.1.0",
    "@vue/cli-plugin-babel": "~4.5.9",
    "@vue/cli-plugin-eslint": "~4.5.9",
    "@vue/cli-plugin-router": "~4.5.9",
    "@vue/cli-plugin-vuex": "~4.5.9",
    "@vue/cli-service": "~4.5.9",
    "@vue/compiler-dom": "^3.2.41",
    "@vue/eslint-config-airbnb": "^5.3.0",
    "@vue/runtime-dom": "^3.2.41",
    "@vuepress/plugin-medium-zoom": "^1.7.1",
    "babel-eslint": "^10.0.3",
    "babel-plugin-transform-remove-console": "^6.9.4",
    "eslint": "^6.8.0",
    "eslint-config-prettier": "^8.5.0",
    "eslint-plugin-import": "^2.22.1",
    "eslint-plugin-prettier": "^4.2.1",
    "eslint-plugin-vue": "6.2.2",
    "prettier": "^2.7.1",
    "sass": "1.32.*",
    "sass-loader": "^10.1.0",
    "vue-particles": "^1.0.9",
    "vue-template-babel-compiler": "^2.0.0",
    "vue-template-compiler": "2.x"
  }
}

vue.config.js

const path = require('path')
const fs = require('fs')
const CompressionPlugin = require('compression-webpack-plugin')

require('dotenv').config()

module.exports = {
  transpileDependencies: true,
  // publicPath: '/apps/dist/',

  publicPath: process.env.NODE_ENV === 'production' ? '/' : '/',
  // ? '/src/app/'
  // : '/src/app/',
  lintOnSave: false,
  parallel: false,
  devServer: {
    https: true,
    key: fs.readFileSync('./certs/example.com+5-key.pem'),
    cert: fs.readFileSync('./certs/example.com+5.pem'),
    public: 'https://localhost:8080/',
    before(app) {
    }
  },
  css: {
    loaderOptions: {
      sass: {
        sassOptions: {
          includePaths: ['./node_modules', './src/assets']
        }
      }
    }
  },
  configureWebpack: {
    performance: {
      hints: false // is_production ? false
    },
    // optimization: {
    //   splitChunks: {
    //     minSize: 10000,
    //     maxSize: 250000
    //   }
    // },
    plugins: [
      // new CompressionPlugin({
      //   filename: '[path][base].br',
      //   algorithm: 'brotliCompress',
      //   test: /\.js$/
      // })
    ],
    resolve: {
      alias: {
        '@themeConfig': path.resolve(__dirname, 'themeConfig.js'),
        '@core': path.resolve(__dirname, 'src/@core'),
        '@validations': path.resolve(
          __dirname,
          'src/@core/utils/validations/validations.js'
        ),
        '@axios': path.resolve(__dirname, 'src/libs/axios'),
        '@views': path.resolve(__dirname, 'src/views'),
        '@libs': path.resolve(__dirname, 'src/libs')
      }
    }
  },
  chainWebpack: (config) => {
    config.module
      .rule('vue')
      .use('vue-loader')
      .loader('vue-loader')
      .tap((options) => {
        // eslint-disable-next-line no-param-reassign
        options.compiler = require('vue-template-babel-compiler')
        options.transformAssetUrls = {
          img: 'src',
          image: 'xlink:href',
          'b-avatar': 'src',
          'b-img': 'src',
          'b-img-lazy': ['src', 'blank-src'],
          'b-card': 'img-src',
          'b-card-img': 'src',
          'b-card-img-lazy': ['src', 'blank-src'],
          'b-carousel-slide': 'img-src',
          'b-embed': 'src'
        }
        return options
      })
  },
  transpileDependencies: ['vue-echarts', 'resize-detector']
}