目录

一，首先确定是否安装有Node.js(首要安装)

环境变量（关键）

二，使用淘宝镜像源

三，全局安装Vue CLI（仅第?次安装需要执?）

利用可视化视图的方式

关于vue-cli的卸载及查看版本程序

---

一，首先确定是否安装有Node.js(首要安装)

官网? Download | Node.js

根据自己计算机环境配置（我现在的配置 ↓↓↓）Download | Node.js (nodejs.org)

安装完成后，以我的安装目录为例【D:Vue-domeNodejs】打开目录创建两个缓存文件夹，因为默认路径是在c盘，占空间。则需在我安装的文件夹【D:Vue-domeNodejs】下创建两个文件夹【node_global】及【node_cache】如下图：

备注：默认位置为：【C:Users用户名AppDataRoaming pm】

然后把npm的指向缓存位置更改，打开win键+R 打开命令指示，输入 cmd打开控制台输入命令：

//这样才能把缓存指定给我们刚创建的文件中，注意：prefix 和 cache的指向文件
npm config set prefix "D:Vue-domeNodejs
ode_global"
npm config set cache "D:Vue-domeNodejs
ode_cache"
1
2
3
4
5

输入命令：npm config list 可查看目录更改路径是否成功

此时在【C:UsersMLoong】位置中查看文件为 .npmrc文件内显示 如图：

则更改成功！

环境变量（关键）

以上Node.js和路径更改操作完成后，修改环境变量，关闭cmd窗口，“我的电脑”-右键-“属性”-“高级系统设置”-“高级”-“环境变量”

点击环境变量新建里面的path，如图下：

（由你的目录为主）注意和目录必须保持一致，不能存在空格，中文名

安装Node.js，设置好环境变量之后，记得关闭控制台。然后重新打开控制台，执行如下命令，检查是否安装成功。win键+R 打开命令指示 输入cmd打开控制台，然后输入如下：

//检查当前是否安装成功 成功会出现版本号
node -v 
//检查npm 
npm -v
1
2
3
4

成功如图：

如果出现node文件不存在或者外部文件不存在，你一点要检查一下环境变量，和安装路径

二，使用淘宝镜像源

像我们国内比较好淘宝镜像源，它提供了一个cnpm的一个下载环境，相对于国外的npm，cnpm会快很多。

如果你用npm config set registry https://registry.npm.taobao.org下载，它可能会出现一个问题就是，下载停住了了那么我推荐使用cnpm来下载

安装cnpm

进入 cmd 命令行， 执行 cnpm 安装模块

**输入指令：**npm install -g cnpm --registry=https://registry.npm.taobao.org

// 配置镜像站
npm install -g cnpm --registry=https://registry.npm.taobao.org
// 检查一下镜像站是否正常
npm config get registry
1
2
3
4

输入 npm config get registry ，检测是否正常

正常

输入 cnpm -v，检测是否正常

如果出现cnpm文件不存在或者外部文件不存在，检查一下环境变量,然后关掉重启。

三，全局安装Vue CLI（仅第次安装需要执）

以上操作完成，可安装vue程序（包括选择版本类型，看需求）

打开cmd控制台，输入以下代码：cnpm install -g @vue/cli 进行安装

（vue-cli 后缀是低版本 @vue/cli为高版本）

安装最新版本：

//高版本
npm install -g @vue/cli
1
2

安装指定版本：

//安装2.9.6版本
npm install -g vue-cli@2.9.6
//安装3.0.3版本
npm install -g @vue/cli@3.0.3
//安装4.0.5版本
npm install -g @vue/cli@4.0.5
//安装4.1.0版本
npm install -g @vue/cli@4.1.0
//安装5.0.0-rc.0版本
npm install -g @vue/cli@5.0.0-rc.0
//安装5.0.4版本
npm install -g @vue/cli@5.0.4
1
2
3
4
5
6
7
8
9
10
11
12

通过vue --version 或 vue -V 查看计算机当前版本：

注意vue -V V是大写

安装完成！！

如果出现vue文件不存在或者外部文件不存在，检查一下环境变量,如果不行 则重新安装

命令： npm install -g @vue/cli --force 安装并且覆盖原有的

等待安装即可

利用可视化视图的方式

在安装好Node.js和vue的客户端的前提上，就变的非常简单了

打开cmd控制台输入命令： vue ui 回车

此时就出现了连接端口（不知道为什么控制台这里少了个零，但是最后显示的是8000，不过可以连接的上，可忽略）

复制连接最好使用谷歌浏览器来 登录 Ready on http://localhost:8000

看到这里不容易吧 现在vue脚手架安装完成，新大陆由你来发现！！

关于vue-cli的卸载及查看版本程序

如果你想卸载，如以下代码：

//卸载3.0之前的版本
npm uninstall -g vue-cli
//卸载3.0之后的版本（可以统一使用此指令卸载）
npm uninstall -g @vue/cli
1
2
3
4

查看所有版本号：

如果你想替换查看所有版本，如以下代码：

//查询3.0之前的版本
npm view vue-cli versions --json
//查询3.0之后的版本
npm view @vue/cli versions --json
1
2
3
4

END

先自我介绍一下，小编13年上师交大毕业，曾经在小公司待过，去过华为OPPO等大厂，18年进入阿里，直到现在。深知大多数初中级java工程师，想要升技能，往往是需要自己摸索成长或是报班学习，但对于培训机构动则近万元的学费，着实压力不小。自己不成体系的自学效率很低又漫长，而且容易碰到天花板技术停止不前。因此我收集了一份《java开发全套学习资料》送给大家，初衷也很简单，就是希望帮助到想自学又不知道该从何学起的朋友，同时减轻大家的负担。添加下方名片，即可获取全套学习资料哦