npm run serve报错This may cause things to work incorrectly. Make sure to use the same version for both

问题描述

前端项目 npm install 后执行npm run serve产生如下报错 This may cause things to work incorrectly. Make sure to use the same version for both.：

Module build failed: Error:

Vue packages version mismatch:

- vue@2.7.14
- vue-template-compiler@2.7.8

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.

@ ./src/router.js 24:15-48
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://localhost:8080&sockPath=/sockjs-node (webpack)/hot/dev-server ./src/main.js

---

原因分析：

出现上述报错主要是因为 vue@2.7.14 和 vue-template-compiler@2.7.8 版本不统一

---

解决方案：

首先，要使用版本统一的 vue 和 vue-template-compiler，需要注意的是：在 package.json 文件中的依赖 dependencies 如果想要 2.7.8 版本的 vue，在版本号前面不要加 ^ 符号（如：“vue”: “^2.7.8”），否则会自动在库里找 "2.7."系列最高的版本，正确的指定格式应该如下：

"dependencies": {
...
"vue": "2.7.8"
...
}

然后，需要删除 node_models 文件夹和 package-lock.json 文件，重新 npm install
然后再 npm run serve 就不会报如上错误了。