vue cli 创建 vue2 项目报错:ERESOLVE unable to resolve dependency tree

Posted GoldenaArcher

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vue cli 创建 vue2 项目报错:ERESOLVE unable to resolve dependency tree相关的知识,希望对你有一定的参考价值。

这是一个很奇怪的问题,package.json 给了别人帮忙下载一下,发现运行并没有任何问题,但是在本机酒完全跑不起来。

公司电脑也没任何问题,并且公司电脑的版本也是 v14.16.XX,运行并没有任何问题。个人电脑的版本也是 v14,但是却安装失败,随后升级到 v14.17.X,也就是最新版本,没用,还是有同样的错误。

问题根源——node 版本过高

最终在这篇文章上找到了答案:vue cli 创建 vue2 项目报错:ERESOLVE unable to resolve dependency tree;但创建 vue3 项目正常,其报错信息与本机相似,都是 vue@2 与@vue/cli-plugin-babel 都产生冲突,从而造成 npm install 失败。

最终原因竟然是:

node 版本过高,导致创建 vue2 项目的时候,依赖存在问题

使用 nvm 做版本控制

最后选择用 nvm 解决版本冲突和版本依赖问题。

现在最新的 nvm 版本是@1.1.7,可以从 github 路径下载:1.1.7 - Maintenance Release,windows 直接可以用 installer 进行安装。

验证 nvm 是否成功安装可以使用 nvm --version 进行查看,安装成功应该会显示下面这些信息:

vue-app-base> nvm --version

Running version 1.1.7.

Usage:

# 省略一串命令

nvm 的基本设置

设置镜像

对于国内用户而言,不设置非常容易报错的就是 registry 了,这点可以通过命令行来解决:

# 设置 node 镜像
nvm node_mirror https://npm.taobao.org/mirrors/node/
# 设置 npm 镜像
nvm npm_mirror https://npm.taobao.org/mirrors/npm/

第一次下载就因为没有配置镜像而导致下载失败。

查看下载的 node 版本

使用 nvm list 即可,如:

vue-app-base> nvm list

    14.17.1
  * 12.22.1 (Currently using 64-bit executable)

这就显示了我当前安装了两个版本的 node,并且现在是用的版本是 v12.22.1

查看有的 node 版本

使用 nvm list available 即可,这里会列出最新更新的版本,完整的还是要到 npm 官网上去看:

vue-app-base> nvm list available

|   CURRENT    |     LTS      |  OLD STABLE  | OLD UNSTABLE |
|--------------|--------------|--------------|--------------|
|    16.4.1    |   14.17.2    |   0.12.18    |   0.11.16    |
|    16.4.0    |   14.17.1    |   0.12.17    |   0.11.15    |
|    16.3.0    |   14.17.0    |   0.12.16    |   0.11.14    |
|    16.2.0    |   14.16.1    |   0.12.15    |   0.11.13    |
|    16.1.0    |   14.16.0    |   0.12.14    |   0.11.12    |
|    16.0.0    |   14.15.5    |   0.12.13    |   0.11.11    |
|   15.14.0    |   14.15.4    |   0.12.12    |   0.11.10    |
|   15.13.0    |   14.15.3    |   0.12.11    |    0.11.9    |
|   15.12.0    |   14.15.2    |   0.12.10    |    0.11.8    |
|   15.11.0    |   14.15.1    |    0.12.9    |    0.11.7    |
|   15.10.0    |   14.15.0    |    0.12.8    |    0.11.6    |
|    15.9.0    |   12.22.2    |    0.12.7    |    0.11.5    |
|    15.8.0    |   12.22.1    |    0.12.6    |    0.11.4    |
|    15.7.0    |   12.22.0    |    0.12.5    |    0.11.3    |
|    15.6.0    |   12.21.0    |    0.12.4    |    0.11.2    |
|    15.5.1    |   12.20.2    |    0.12.3    |    0.11.1    |
|    15.5.0    |   12.20.1    |    0.12.2    |    0.11.0    |
|    15.4.0    |   12.20.0    |    0.12.1    |    0.9.12    |
|    15.3.0    |   12.19.1    |    0.12.0    |    0.9.11    |
|    15.2.1    |   12.19.0    |   0.10.48    |    0.9.10    |

This is a partial list. For a complete list, visit https://nodejs.org/download/release

安装不同版本的 node

使用 npm install <version> 即可,如之前安装 v12.22.1 时:

vue-app-base> nvm install 12.22.1
Downloading node.js version 12.22.1 (64-bit)...
Complete
Downloading npm version 6.14.12... Complete
Installing npm v6.14.12...

Installation complete. If you want to use this version, type

nvm use 12.22.1

卸载不同版本的 node

这就是之前没有设置镜像时候碰到的事情,node 下载下来了,但是 npm 没下载,所以只能卸载重来。卸载的指令是 nvm uninstall <version>,如:

vue-app-base> nvm uninstall 12.22.1
Uninstalling node v12.22.1... done

使用不同版本的 node

在安装好了就有提示,使用 nvm use <version> 即可,如:

vue-app-base> nvm use 12.22.1
Now using node v12.22.1 (64-bit)
vue-app-base> node --version
v12.22.1
vue-app-base> npm --version
6.14.12

以上是关于vue cli 创建 vue2 项目报错:ERESOLVE unable to resolve dependency tree的主要内容,如果未能解决你的问题,请参考以下文章

vue-cli 初始化创建 vue2.9.6 项目

vue-cli 初始化创建 vue2.9.6 项目

如何在使用 vue-cli3 创建的 Vue2 项目中使用 axios

vue2 vue3 创建项目指令

Vue2.0 实战项目 ——安装vue.cli

Vue2.6.10(Vue-cli4)项目打包性能优化实践