Vue脚手架安装教程

安装Node.js

1. 搜索node.js官网下载自己对应版本 Node.js官网

注意这里尽量不要使用15版本以上的，当时我下载的是最近版的当后面创建vue项目时候会报错，最后排查是因为版本问题，没有办法我又卸载重新安装了一遍

2. 这里我们下载其他版本的

3. 我这里下载的是14.17.6版本，大家可以根据自己的喜爱下载对应的版本，尽量是在15版本以下10版本以上的

接下来就是傻瓜式的安装步骤，大家选一个自己想要安装的目录，这里我就不多赘述，其中一个安装步骤简单说下，其他直接点下一步即可
如果你下载的是一个zip包，解压出来效果是一样的

配置环境变量

前序工作

在安装的目录下创建两个文件夹
系统默认的将我们下载的文件已近缓存放在c盘，这里我们将他放在自己D盘的这两个目录中
node_cache：存放缓存
node_global：存放下载的vue脚手架

开始配置

“此电脑”-右键-“属性”-“高级系统设置”-“高级”-“环境变量”
在系统变量中新建NODE_PATH，值为Node.js所在位置（我的是D:\APPDATE\node.js）

之后将他加入Path中，命名为%NODE_PATH%
这个作用就是可以使用npm命令

接下来在用户环境中配置,同样是相同的步骤，这一步配置到node_global
目的是可以直接使用等会我们下载的vue命令

至此环境变量已经配置好，我们可以检测下是否已经配置好了环境变量
在键盘按下【win+R】键，输入cmd，然后回车，打开cmd窗口

当输入这两个查看版本的命令显示版本号就说明已经成功了（其实能完成这两个命令是因为安装后默认就在电脑中配置了相应环境变量，大家可以去电脑中看一下，其中有些地方我们需要更改下）

npm的作用就是对Node.js依赖的包进行管理

配置npm的全局模块的存放路径、cache的路径，在命令提示符中执行命令
目的：将我们刚创建的两个目录设置为系统默认路径

分别输入两个命令
npm config set prefix "D:\APPDATE\node.js\node_global" //D:\APPDATE    是我自己定义的安装的目录，大家放到自己的目录下
npm config set cache "D:\APPDATE\node.js\node_cache"

当执行代码后这两个文件会自动帮我们配置到node.js目录下
node_global：是我们用node.js下载资源存放的目录
node_cache：是类似缓存目录（我这里并不是很清楚）

配置淘宝镜像

npm config set registry https://registry.npm.taobao.org//为了增加下载速度

开始下载Vue脚手架

在命令提示符中输入，如果出现卡顿按下回车

npm install -g @vue/cli
//此时下载存放的位置是node_global中

等待一会之后，输入vue查看安装是否成功，如果出现以下界面就表示成功了

创建一个Vue项目

• 在要创建工程的目录下输入 ：vue create 项目名
• 按照提示进入工程目录：cd 项目名
• 按照提示运行项目：npm run serve

当出现Successfully就成功了，按照提示运行项目：npm run serve就可以了