Vue脚手架的安装（超详细篇，保姆级教程）

一、环境安装

1.软件下载

官网：https://github.com/coreybutler/nvm-windows/releases

官网往下滑，找到这个nvm-setup.zip,然后进行下载

2.安装

下载后，双击进行安装，注意安装目录不要出现中文和空格

安装后，打开cmd，输入命令 nvm ，查看安装版本

修改一下下载的镜像地址：

打开一下你刚刚的安装目录nvm，双击打开，找到settings.txt，然后用记事本编辑打开，复制粘贴

node_mirror: http://npmmirror.com/mirrors/node/
npm_mirror: http://npmmirror.com/mirrors/npm/

随后保存，这样子我们镜像就配置完成了

3.使用

打开cmd（快捷键win+R）

（1）安装指定版本的node

这边的安装版本可以跟我的一样，安装16.20.2和14.21.3的版本

nvm install 14.21.3 // 安装14.21.3 版本node 或者输入

如果要安装最新的版本：

nvm install 14 nvm install latest // 安装最新版本node

（2）查看node所有安装版本

nvm list

这边我下载了node的14和16的版本

可以看到这个就说明你刚刚安装的版本成功了！！！

（3）使用指定版本的node

nvm use 14.21.3 // 使用14.21.3版本node

此时，你再次输入nvm list

（4）查看node和nvm的使用版本

node -v

npm -v

 

这版本是相互匹配的，

16版本的node就是跟着8版本的npm

14版本的node就是跟着6版本的npm

（5）卸载指定版本的node

nvm uninstall 14.5.0 // 卸载14.5.0版本node

4、安装成功后可查看系统环境变量

这个系统环境变量是它自己添加上去的，不用我们手动添加

查看path：

能看到环境变量的就是环境安装成功了

二、安装脚手架

 

-g的意识是全局安装，就-g和-s，-s是局部安装，就是只在当前项目可以使用

这边建议全局安装，使用-g，所有项目都可以使用

npm install @vue/cli -g  

如果安装不成功那就使用管理员身份打开运行，然后再输入命令

 

脚手架安装完之后，打开nvm安装目录，打开你刚刚使用node的版本

（我是使用16版本的）

安装成功示例：

然后再打开cmd，输入vue

输入   vue -V  可以查看脚手架的安装版本

安装失败示例：

三、项目创建和运行

项目创建：

打开你要创建项目的目录下，

直接输入cmd打开

这样子你就可以进入当前目录

输入  vue create 项目名

按下回车键，之后会出现这个页面

弄到这个就说明项目创建成功

项目运行：

说明项目运行成功

四、基本使用和说明

在这边进行项目的运行，快捷键   ctrl+`   打开控制台输入npm run serve进行项目运行

成功~~~