Home > OS >  wanted to install vue 3, now nothing works
wanted to install vue 3, now nothing works

Time:09-30

I started to program my project with vue 2.6.11 and I wanted to update it with the newest vue 3.

Than it doesn't worked anymore at all. So I tryed to install the old 2.6.11 back, but it didn't worked out. Now I tryed a lot of solutions, and am stuck. Probably I just made everything even more chaotic.

But nothing works out anymore. i left the project for a while, now I have new energy and want to ask here for help.


> [email protected] start
> webpack-dev-server --open

i 「wds」: Project is running at http://localhost:8080/
i 「wds」: webpack output is served from /
i 「wds」: Content not from webpack is served from C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo
i 「wds」: 404s will fallback to /index.html
i 「wdm」: wait until bundle finished: /
× 「wdm」: Hash: f7fb2b57707ebcfe87db
Version: webpack 4.46.0
Time: 2268ms
Built at: 25.09.2021 17:19:28
     Asset      Size  Chunks             Chunk Names
index.html  1.62 KiB          [emitted]
   main.js  1.36 MiB    main  [emitted]  main
Entrypoint main = main.js
[0] multi (webpack)-dev-server/client?http://localhost:8080 ./src 40 bytes {main} [built]
[./node_modules/strip-ansi/index.js] 161 bytes {main} [built]
[./node_modules/vee-validate/dist/vee-validate.esm.js] 326 KiB {main} [built]
[./node_modules/vue/dist/vue.runtime.esm-bundler.js] 611 bytes {main} [built]
[./node_modules/webpack-dev-server/client/index.js?http://localhost:8080] (webpack)-dev-server/client?http://localhost:8080 4.29 KiB {main} [built]
[./node_modules/webpack-dev-server/client/overlay.js] (webpack)-dev-server/client/overlay.js 3.51 KiB {main} [built]
[./node_modules/webpack-dev-server/client/socket.js] (webpack)-dev-server/client/socket.js 1.53 KiB {main} [built]
[./node_modules/webpack-dev-server/client/utils/createSocketUrl.js] (webpack)-dev-server/client/utils/createSocketUrl.js 2.89 KiB {main} [built]
[./node_modules/webpack-dev-server/client/utils/log.js] (webpack)-dev-server/client/utils/log.js 964 bytes {main} [built]
[./node_modules/webpack-dev-server/client/utils/reloadApp.js] (webpack)-dev-server/client/utils/reloadApp.js 1.59 KiB {main} [built]
[./node_modules/webpack-dev-server/client/utils/sendMessage.js] (webpack)-dev-server/client/utils/sendMessage.js 402 bytes {main} [built]
[./node_modules/webpack/hot sync ^\.\/log$] (webpack)/hot sync nonrecursive ^\.\/log$ 170 bytes {main} [built]
[./src/_helpers/index.js] 930 bytes {main} [built]
[./src/_store/index.js] 687 bytes {main} [built]
[./src/index.js] 708 bytes {main} [built]
      61 hidden modules

ERROR in ./src/app/App.vue
Module build failed (from ./node_modules/vue-loader/index.js):
Error:

Vue packages version mismatch:

- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue\index.js)
- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\package.json)

This may cause things to work incorrectly. Make sure to use the same version for both.
If you are using vue-loader@>=10.0, simply update vue-template-compiler.
If you are using vue-loader@<10.0 or vueify, re-installing vue-loader/vueify should bump vue-template-compiler to the latest.

    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\index.js:10:9)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
    at Module.load (node:internal/modules/cjs/loader:988:32)
    at Function.Module._load (node:internal/modules/cjs/loader:828:14)
    at Module.require (node:internal/modules/cjs/loader:1012:19)
    at require (node:internal/modules/cjs/helpers:93:18)
    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-loader\lib\parser.js:1:18)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
 @ ./src/index.js 15:11-31

ERROR in ./src/home/RegisterPage.vue
Module build failed (from ./node_modules/vue-loader/index.js):
Error:

Vue packages version mismatch:

- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue\index.js)
- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\package.json)

This may cause things to work incorrectly. Make sure to use the same version for both.
If you are using vue-loader@>=10.0, simply update vue-template-compiler.
If you are using vue-loader@<10.0 or vueify, re-installing vue-loader/vueify should bump vue-template-compiler to the latest.

    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\index.js:10:9)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
    at Module.load (node:internal/modules/cjs/loader:988:32)
    at Function.Module._load (node:internal/modules/cjs/loader:828:14)
    at Module.require (node:internal/modules/cjs/loader:1012:19)
    at require (node:internal/modules/cjs/helpers:93:18)
    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-loader\lib\parser.js:1:18)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
 @ ./src/_helpers/router.js 24:20-51
 @ ./src/_helpers/index.js
 @ ./src/index.js

ERROR in ./src/home/HomePage.vue
Module build failed (from ./node_modules/vue-loader/index.js):
Error:

Vue packages version mismatch:

- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue\index.js)
- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\package.json)

This may cause things to work incorrectly. Make sure to use the same version for both.
If you are using vue-loader@>=10.0, simply update vue-template-compiler.
If you are using vue-loader@<10.0 or vueify, re-installing vue-loader/vueify should bump vue-template-compiler to the latest.

    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\index.js:10:9)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
    at Module.load (node:internal/modules/cjs/loader:988:32)
    at Function.Module._load (node:internal/modules/cjs/loader:828:14)
    at Module.require (node:internal/modules/cjs/loader:1012:19)
    at require (node:internal/modules/cjs/helpers:93:18)
    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-loader\lib\parser.js:1:18)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
 @ ./src/_helpers/router.js 16:16-43
 @ ./src/_helpers/index.js
 @ ./src/index.js

ERROR in ./src/home/inspiration.vue
Module build failed (from ./node_modules/vue-loader/index.js):
Error:

Vue packages version mismatch:

- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue\index.js)
- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\package.json)

This may cause things to work incorrectly. Make sure to use the same version for both.
If you are using vue-loader@>=10.0, simply update vue-template-compiler.
If you are using vue-loader@<10.0 or vueify, re-installing vue-loader/vueify should bump vue-template-compiler to the latest.

    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\index.js:10:9)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
    at Module.load (node:internal/modules/cjs/loader:988:32)
    at Function.Module._load (node:internal/modules/cjs/loader:828:14)
    at Module.require (node:internal/modules/cjs/loader:1012:19)
    at require (node:internal/modules/cjs/helpers:93:18)
    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-loader\lib\parser.js:1:18)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
 @ ./src/_helpers/router.js 32:19-49
 @ ./src/_helpers/index.js
 @ ./src/index.js

ERROR in ./src/home/LoginPage.vue
Module build failed (from ./node_modules/vue-loader/index.js):
Error:

Vue packages version mismatch:

- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue\index.js)
- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\package.json)

This may cause things to work incorrectly. Make sure to use the same version for both.
If you are using vue-loader@>=10.0, simply update vue-template-compiler.
If you are using vue-loader@<10.0 or vueify, re-installing vue-loader/vueify should bump vue-template-compiler to the latest.

    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\index.js:10:9)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
    at Module.load (node:internal/modules/cjs/loader:988:32)
    at Function.Module._load (node:internal/modules/cjs/loader:828:14)
    at Module.require (node:internal/modules/cjs/loader:1012:19)
    at require (node:internal/modules/cjs/helpers:93:18)
    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-loader\lib\parser.js:1:18)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
 @ ./src/_helpers/router.js 20:17-45
 @ ./src/_helpers/index.js
 @ ./src/index.js

ERROR in ./src/home/UploadPage.vue
Module build failed (from ./node_modules/vue-loader/index.js):
Error:

Vue packages version mismatch:

- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue\index.js)
- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\package.json)

This may cause things to work incorrectly. Make sure to use the same version for both.
If you are using vue-loader@>=10.0, simply update vue-template-compiler.
If you are using vue-loader@<10.0 or vueify, re-installing vue-loader/vueify should bump vue-template-compiler to the latest.

    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\index.js:10:9)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
    at Module.load (node:internal/modules/cjs/loader:988:32)
    at Function.Module._load (node:internal/modules/cjs/loader:828:14)
    at Module.require (node:internal/modules/cjs/loader:1012:19)
    at require (node:internal/modules/cjs/helpers:93:18)
    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-loader\lib\parser.js:1:18)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
 @ ./src/_helpers/router.js 28:18-47
 @ ./src/_helpers/index.js
 @ ./src/index.js

ERROR in ./src/home/unfolding.vue
Module build failed (from ./node_modules/vue-loader/index.js):
Error:

Vue packages version mismatch:

- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue\index.js)
- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\package.json)

This may cause things to work incorrectly. Make sure to use the same version for both.
If you are using vue-loader@>=10.0, simply update vue-template-compiler.
If you are using vue-loader@<10.0 or vueify, re-installing vue-loader/vueify should bump vue-template-compiler to the latest.

    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\index.js:10:9)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
    at Module.load (node:internal/modules/cjs/loader:988:32)
    at Function.Module._load (node:internal/modules/cjs/loader:828:14)
    at Module.require (node:internal/modules/cjs/loader:1012:19)
    at require (node:internal/modules/cjs/helpers:93:18)
    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-loader\lib\parser.js:1:18)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
 @ ./src/_helpers/router.js 36:17-45
 @ ./src/_helpers/index.js
 @ ./src/index.js

ERROR in ./src/home/UserList.vue
Module build failed (from ./node_modules/vue-loader/index.js):
Error:

Vue packages version mismatch:

- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue\index.js)
- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\package.json)

This may cause things to work incorrectly. Make sure to use the same version for both.
If you are using vue-loader@>=10.0, simply update vue-template-compiler.
If you are using vue-loader@<10.0 or vueify, re-installing vue-loader/vueify should bump vue-template-compiler to the latest.

    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\index.js:10:9)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
    at Module.load (node:internal/modules/cjs/loader:988:32)
    at Function.Module._load (node:internal/modules/cjs/loader:828:14)
    at Module.require (node:internal/modules/cjs/loader:1012:19)
    at require (node:internal/modules/cjs/helpers:93:18)
    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-loader\lib\parser.js:1:18)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
 @ ./src/_helpers/router.js 44:16-43
 @ ./src/_helpers/index.js
 @ ./src/index.js

ERROR in ./src/home/communities.vue
Module build failed (from ./node_modules/vue-loader/index.js):
Error:

Vue packages version mismatch:

- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue\index.js)
- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\package.json)

This may cause things to work incorrectly. Make sure to use the same version for both.
If you are using vue-loader@>=10.0, simply update vue-template-compiler.
If you are using vue-loader@<10.0 or vueify, re-installing vue-loader/vueify should bump vue-template-compiler to the latest.

    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\index.js:10:9)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
    at Module.load (node:internal/modules/cjs/loader:988:32)
    at Function.Module._load (node:internal/modules/cjs/loader:828:14)
    at Module.require (node:internal/modules/cjs/loader:1012:19)
    at require (node:internal/modules/cjs/helpers:93:18)
    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-loader\lib\parser.js:1:18)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
 @ ./src/_helpers/router.js 40:19-49
 @ ./src/_helpers/index.js
 @ ./src/index.js

ERROR in ./src/home/Messages.vue
Module build failed (from ./node_modules/vue-loader/index.js):
Error:

Vue packages version mismatch:

- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue\index.js)
- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\package.json)

This may cause things to work incorrectly. Make sure to use the same version for both.
If you are using vue-loader@>=10.0, simply update vue-template-compiler.
If you are using vue-loader@<10.0 or vueify, re-installing vue-loader/vueify should bump vue-template-compiler to the latest.

    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\index.js:10:9)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
    at Module.load (node:internal/modules/cjs/loader:988:32)
    at Function.Module._load (node:internal/modules/cjs/loader:828:14)
    at Module.require (node:internal/modules/cjs/loader:1012:19)
    at require (node:internal/modules/cjs/helpers:93:18)
    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-loader\lib\parser.js:1:18)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
 @ ./src/_helpers/router.js 52:16-43
 @ ./src/_helpers/index.js
 @ ./src/index.js

ERROR in ./src/home/Profile.vue
Module build failed (from ./node_modules/vue-loader/index.js):
Error:

Vue packages version mismatch:

- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue\index.js)
- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\package.json)

This may cause things to work incorrectly. Make sure to use the same version for both.
If you are using vue-loader@>=10.0, simply update vue-template-compiler.
If you are using vue-loader@<10.0 or vueify, re-installing vue-loader/vueify should bump vue-template-compiler to the latest.

    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\index.js:10:9)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
    at Module.load (node:internal/modules/cjs/loader:988:32)
    at Function.Module._load (node:internal/modules/cjs/loader:828:14)
    at Module.require (node:internal/modules/cjs/loader:1012:19)
    at require (node:internal/modules/cjs/helpers:93:18)
    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-loader\lib\parser.js:1:18)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
 @ ./src/_helpers/router.js 48:15-41
 @ ./src/_helpers/index.js
 @ ./src/index.js

ERROR in ./src/home/Settings.vue
Module build failed (from ./node_modules/vue-loader/index.js):
Error:

Vue packages version mismatch:

- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue\index.js)
- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\package.json)

This may cause things to work incorrectly. Make sure to use the same version for both.
If you are using vue-loader@>=10.0, simply update vue-template-compiler.
If you are using vue-loader@<10.0 or vueify, re-installing vue-loader/vueify should bump vue-template-compiler to the latest.

    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\index.js:10:9)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
    at Module.load (node:internal/modules/cjs/loader:988:32)
    at Function.Module._load (node:internal/modules/cjs/loader:828:14)
    at Module.require (node:internal/modules/cjs/loader:1012:19)
    at require (node:internal/modules/cjs/helpers:93:18)
    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-loader\lib\parser.js:1:18)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
 @ ./src/_helpers/router.js 56:16-43
 @ ./src/_helpers/index.js
 @ ./src/index.js

ERROR in ./src/home/Events.vue
Module build failed (from ./node_modules/vue-loader/index.js):
Error:

Vue packages version mismatch:

- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue\index.js)
- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\package.json)

This may cause things to work incorrectly. Make sure to use the same version for both.
If you are using vue-loader@>=10.0, simply update vue-template-compiler.
If you are using vue-loader@<10.0 or vueify, re-installing vue-loader/vueify should bump vue-template-compiler to the latest.

    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\index.js:10:9)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
    at Module.load (node:internal/modules/cjs/loader:988:32)
    at Function.Module._load (node:internal/modules/cjs/loader:828:14)
    at Module.require (node:internal/modules/cjs/loader:1012:19)
    at require (node:internal/modules/cjs/helpers:93:18)
    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-loader\lib\parser.js:1:18)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
 @ ./src/_helpers/router.js 60:14-39
 @ ./src/_helpers/index.js
 @ ./src/index.js

ERROR in ./src/home/AboutPage.vue
Module build failed (from ./node_modules/vue-loader/index.js):

...

Error:

Vue packages version mismatch:

- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue\index.js)
- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\package.json)

This may cause things to work incorrectly. Make sure to use the same version for both.
If you are using vue-loader@>=10.0, simply update vue-template-compiler.
If you are using vue-loader@<10.0 or vueify, re-installing vue-loader/vueify should bump vue-template-compiler to the latest.

    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\index.js:10:9)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
    at Module.load (node:internal/modules/cjs/loader:988:32)
    at Function.Module._load (node:internal/modules/cjs/loader:828:14)
    at Module.require (node:internal/modules/cjs/loader:1012:19)
    at require (node:internal/modules/cjs/helpers:93:18)
    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-loader\lib\parser.js:1:18)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
 @ ./src/_helpers/router.js 92:12-46
 @ ./src/_helpers/index.js
 @ ./src/index.js

ERROR in ./src/home/categories/Music.vue
Module build failed (from ./node_modules/vue-loader/index.js):
Error:

Vue packages version mismatch:

- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue\index.js)
- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\package.json)

This may cause things to work incorrectly. Make sure to use the same version for both.
If you are using vue-loader@>=10.0, simply update vue-template-compiler.
If you are using vue-loader@<10.0 or vueify, re-installing vue-loader/vueify should bump vue-template-compiler to the latest.

    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\index.js:10:9)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
    at Module.load (node:internal/modules/cjs/loader:988:32)
    at Function.Module._load (node:internal/modules/cjs/loader:828:14)
    at Module.require (node:internal/modules/cjs/loader:1012:19)
    at require (node:internal/modules/cjs/helpers:93:18)
    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-loader\lib\parser.js:1:18)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
 @ ./src/_helpers/router.js 96:13-48
 @ ./src/_helpers/index.js
 @ ./src/index.js

ERROR in ./src/home/categories/Lang.vue
Module build failed (from ./node_modules/vue-loader/index.js):
Error:

Vue packages version mismatch:

- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue\index.js)
- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\package.json)

This may cause things to work incorrectly. Make sure to use the same version for both.
If you are using vue-loader@>=10.0, simply update vue-template-compiler.
If you are using vue-loader@<10.0 or vueify, re-installing vue-loader/vueify should bump vue-template-compiler to the latest.

    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\index.js:10:9)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
    at Module.load (node:internal/modules/cjs/loader:988:32)
    at Function.Module._load (node:internal/modules/cjs/loader:828:14)
    at Module.require (node:internal/modules/cjs/loader:1012:19)
    at require (node:internal/modules/cjs/helpers:93:18)
    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-loader\lib\parser.js:1:18)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
 @ ./src/_helpers/router.js 100:12-46
 @ ./src/_helpers/index.js
 @ ./src/index.js

ERROR in ./src/home/categories/Interest/Aerobic.vue
Module build failed (from ./node_modules/vue-loader/index.js):
Error:

Vue packages version mismatch:

- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue\index.js)
- [email protected] (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\package.json)

This may cause things to work incorrectly. Make sure to use the same version for both.
If you are using vue-loader@>=10.0, simply update vue-template-compiler.
If you are using vue-loader@<10.0 or vueify, re-installing vue-loader/vueify should bump vue-template-compiler to the latest.

    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-template-compiler\index.js:10:9)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
    at Module.load (node:internal/modules/cjs/loader:988:32)
    at Function.Module._load (node:internal/modules/cjs/loader:828:14)
    at Module.require (node:internal/modules/cjs/loader:1012:19)
    at require (node:internal/modules/cjs/helpers:93:18)
    at Object.<anonymous> (C:\Users\dzeug\Desktop\Websites\Daniel\InspiRingDemo\node_modules\vue-loader\lib\parser.js:1:18)
    at Module._compile (node:internal/modules/cjs/loader:1108:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
 @ ./src/_helpers/router.js 104:15-61
 @ ./src/_helpers/index.js
 @ ./src/index.js
Child html-webpack-plugin for "index.html":
     1 asset
    Entrypoint undefined = index.html
    [./node_modules/html-webpack-plugin/lib/loader.js!./src/index.html] 1.86 KiB {0} [built]
    [./node_modules/lodash/lodash.js] 528 KiB {0} [built]
    [./node_modules/webpack/buildin/global.js] (webpack)/buildin/global.js 472 bytes {0} [built]
    [./node_modules/webpack/buildin/module.js] (webpack)/buildin/module.js 497 bytes {0} [built]
i 「wdm」: Failed to compile.

Can someone please help me to make it work again?

Can I do it with vue 3 or go back to vue 2.

I am just learning and would like to learn more with vue 3.

Thank you very much.

CodePudding user response:

The Vue 3 documentation has a Migration Build example. Follow their steps and maybe you'll find out where it went wrong.

Another solution might be to create the Vue 3 project from scratch, re-do the setups for router, store, vueconfig, etc, and then migrate your components and views one by one.

The documentation tries to be as clear as possible in the main differences between Vue 2 and Vue 3, so check the docs for a more precise explanation of it.

  • Related