Vue packages version mismatch，vue&vue-template-compiler版本冲突导致的编译异常解决
wzh@wzhdeMacBook-Pro cc-doc % vuepress build
wait Extracting site metadata...
tip Apply theme @vuepress/theme-default ...
tip Apply plugin container (i.e. "vuepress-plugin-container") ...
tip Apply plugin @vuepress/register-components (i.e. "@vuepress/plugin-register-components") ...
tip Apply plugin @vuepress/active-header-links (i.e. "@vuepress/plugin-active-header-links") ...
tip Apply plugin @vuepress/search (i.e. "@vuepress/plugin-search") ...
tip Apply plugin @vuepress/nprogress (i.e. "@vuepress/plugin-nprogress") ...
Error:
Vue packages version mismatch:
- [email protected] (/Users/wzh/work/vscode/cc-doc/node_modules/vue/index.js)
- [email protected] (/Users/wzh/work/vscode/cc-doc/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.
at Module._compile (node:internal/modules/cjs/loader:1119:14)
at Module._extensions..js (node:internal/modules/cjs/loader:1173:10)
at Module.load (node:internal/modules/cjs/loader:997:32)
at Module._load (node:internal/modules/cjs/loader:838:12)
at Module.require (node:internal/modules/cjs/loader:1021:19)
at require (node:internal/modules/cjs/helpers:103:18)
at loadFromContext (/usr/local/lib/node_modules/vuepress/node_modules/vue-loader/lib/compiler.js:30:10)
at loadTemplateCompiler (/usr/local/lib/node_modules/vuepress/node_modules/vue-loader/lib/compiler.js:37:12)
at exports.resolveCompiler (/usr/local/lib/node_modules/vuepress/node_modules/vue-loader/lib/compiler.js:25:23)
at VueLoaderPlugin.apply (/usr/local/lib/node_modules/vuepress/node_modules/vue-loader/lib/plugin-webpack4.js:91:22)
at webpack (/usr/local/lib/node_modules/vuepress/node_modules/webpack/lib/webpack.js:51:13)
at /usr/local/lib/node_modules/vuepress/node_modules/webpack/lib/webpack.js:36:39
at Array.map (
at webpack (/usr/local/lib/node_modules/vuepress/node_modules/webpack/lib/webpack.js:36:24)
at /usr/local/lib/node_modules/vuepress/node_modules/@vuepress/core/lib/node/build/index.js:182:5
at new Promise (
at compile (/usr/local/lib/node_modules/vuepress/node_modules/@vuepress/core/lib/node/build/index.js:181:10)
at Build.render (/usr/local/lib/node_modules/vuepress/node_modules/@vuepress/core/lib/node/build/index.js:55:25)
at App.build (/usr/local/lib/node_modules/vuepress/node_modules/@vuepress/core/lib/node/App.js:499:29)
解决过程：
查看vue的相关安装环境：
wzh@wzhdeMacBook-Pro cc-doc % npm list vue
cc-doc@ /Users/wzh/work/vscode/cc-doc
├─┬ @vue/[email protected]
│ └── [email protected]
├─┬ [email protected]
│ └─┬ @vue/[email protected]
│ └── [email protected] deduped
└─┬ [email protected]
└─┬ @vuepress/[email protected]
├─┬ @vue/[email protected]
│ ├─┬ @vue/[email protected]
│ │ └── [email protected] deduped
│ └── [email protected] deduped
└── [email protected]
不用修改代码里面的版本配置，直接按需要的版本，安装vue对应版本；
wzh@wzhdeMacBook-Pro cc-doc % npm install [email protected]
removed 14 packages, changed 4 packages, and audited 1860 packages in 20s
143 packages are looking for funding
run `npm fund` for details
43 vulnerabilities (1 low, 10 moderate, 29 high, 3 critical)
To address issues that do not require attention, run:
npm audit fix
To address all issues possible (including breaking changes), run:
npm audit fix --force
Some issues need review, and may require choosing
a different dependency.
Run `npm audit` for details.
安装完成后，正常编译：
wzh@wzhdeMacBook-Pro cc-doc % vuepress build
wait Extracting site metadata...
tip Apply theme @vuepress/theme-default ...
tip Apply plugin container (i.e. "vuepress-plugin-container") ...
tip Apply plugin @vuepress/register-components (i.e. "@vuepress/plugin-register-components") ...
tip Apply plugin @vuepress/active-header-links (i.e. "@vuepress/plugin-active-header-links") ...
tip Apply plugin @vuepress/search (i.e. "@vuepress/plugin-search") ...
tip Apply plugin @vuepress/nprogress (i.e. "@vuepress/plugin-nprogress") ...
● Client █████████████████████████ building (22%) 105/146 modules 41 active
● Client █████████████████████████ building (22%) 105/146 modules 41 active
...ue-loader › ../../../../../usr/local/lib/node_modules/vuepress/node_modules/@vuepress/core/lib/client/components/GlobalLayout.vue
● Server █████████████████████████ building (22%) 108/149 modules 41 activ