首先要下载node.js
下载 | Node.js 中文网 (nodejs.cn)
https://nodejs.cn/download/![](https://img-blog.csdnimg.cn/4ddba071af4f487f87d26607c2eab923.png)
大家根据自己的系统来选择哪个,我是Windows系统,所以选择红色箭头所指的安装包去安装!!!
接下来双击安装!!
![](https://img-blog.csdnimg.cn/b06af326b3cf46238d2e080f2faf5b65.png)
![](https://img-blog.csdnimg.cn/37265bf4157c45f1b6a696ff5dec8075.png)
![](https://img-blog.csdnimg.cn/78b0563ca0154927a5f1abbc19300c1c.png)
选择要安装的位置,不是必须要安装到C盘中,想安装到哪里就安装到哪里!!!
![](https://img-blog.csdnimg.cn/dec2985f30854a4ba5f5ca494f686103.png)
![](https://img-blog.csdnimg.cn/0938e661504f48ebbc7a134e083bec1d.png)
![](https://img-blog.csdnimg.cn/7ff513ad0eff435d95466302d04abd75.png)
![](https://img-blog.csdnimg.cn/257ae998a531412eb29b52670e056110.png)
接下来打开终端看一下是否安装成功了!!!(按下win+r/R)先按win,再按r/R
![](https://img-blog.csdnimg.cn/563952105db446668c01fd2d422f60ec.png)
![](https://img-blog.csdnimg.cn/08cbbce5de394a10b601c3a42cfcca41.png)
输入cmd再按确定
输入终端指令node -v 查看版本号
![](https://img-blog.csdnimg.cn/00bb69fc48834c2388822791d733138c.png)
这时候就会出现对应的版本,如果你能终端打印出来这个,说明已经成功一半了,但是这个版本太高了,有时候运行项目的时候会报错,此时我们需要把版本降低,那么如何把版本降低呢??
官网传送门
下载 | Node.js 中文网 (nodejs.cn)
https://nodejs.cn/download/
![](https://img-blog.csdnimg.cn/7ec8d5a7f48e42648070bee48416931e.png)
![](https://img-blog.csdnimg.cn/84b6c20cbbf2467a92faf7408cd4a6cc.png)
![](https://img-blog.csdnimg.cn/5d2fd2dac625483ea5efd67dfa42275f.png)
![](https://img-blog.csdnimg.cn/7feade6117b044e7a3e68f851de66f26.png)
![](https://img-blog.csdnimg.cn/fe87076f2b434b00a855c52b768ca73b.png)
![](https://img-blog.csdnimg.cn/65e4aaa60e194e3d96b45f5a8eae6258.png)
把这个东西拖到之前node.js的安装目录下覆盖原来的即可
![](https://img-blog.csdnimg.cn/5173f69ab9a241ad806f293beccc8f2c.png)
![](https://img-blog.csdnimg.cn/91e201858b8d44249c561af27e5c114f.png)
这时候再次打开终端,输入node -v指令,查看版本号!!!
![](https://img-blog.csdnimg.cn/ed014c8b58f241418f14f9968135daa2.png)
这时候版本就降下来咯!!!
此时终端输入命令npm install -g @vue/cli 下载脚手架
![](https://img-blog.csdnimg.cn/864daae951ba4e92b074aa2e715a9691.png)
输入命令vue -V查看版本号
![](https://img-blog.csdnimg.cn/72a5f13a14ce4b30b1dae691a5b92e84.png)
这时候就说明脚手架安装成功了!!这时候我们来创建一个Vue项目!!!我们尝试在D盘下面创建一个Vue项目!!!
![](https://img-blog.csdnimg.cn/0ffd51c3343e402da3801dddeceacb51.png)
先切换到D盘下面,然后输入此命令,mytest是项目名称,可以自己取名字!!!然后回车!!!
![](https://img-blog.csdnimg.cn/9da2bcf63e964807b8f5dac9a0e721de.png)
到了这里他会让你选择创建vue2还是vue3项目,根据自己的需要,这里我以vue2为例,选择Vue2再直接回车!!!之后便是漫长的等待!
![](https://img-blog.csdnimg.cn/17fa6e5015e941888de71e6b57bc97d7.png)
此时你会发现你可能卡到一个地方很久,一直没有动 ,这时候我们可以考虑去切换淘宝镜像或者阿里镜像,这样子下载会快许多!!
切换镜像: npm config set registry http://registry.npm.taobao.org/
查看镜像使用状态:npm get registry
![](https://img-blog.csdnimg.cn/6454b2d98da941588474f465335ee89f.png)
这时候重复上面创建vue项目的操作!!!
![](https://img-blog.csdnimg.cn/6d3d354383594157a2229e6be34adbdd.png)
又卡住了呜呜呜,那就再去试一试别的镜像
切换镜像
![](https://img-blog.csdnimg.cn/e9a62d4cc8694a6fb557baeff8bc5efd.png)
切换镜像:npm config set registry https://registry.npmmirror.com/
查看镜像使用状态:npm get registry
![](https://img-blog.csdnimg.cn/3ff1119a2bf7404eb094e82901b3728b.png)
重复vue创建操作
啊啊啊 终于成功咯!!!呜呜呜,总之大家多试几次!!!
然后输入他提示的指令,再回车
![](https://img-blog.csdnimg.cn/692429e943694eaca310460535fecaa7.png)
可以把这个链接复制到浏览器回车,也可以左手按住ctrl,右手鼠标点击,他会发生页面跳转,一般是这样子的,但是不一定所有电脑都行,但是前者肯定是可以的 !
![](https://img-blog.csdnimg.cn/d68afaea093c4447861b571c47ab81c5.png)
当你看到这个页面的时候,说明一个简单的Vue2项目创建成功咯!!!
在D盘里面也会出现相应的文件夹,可以用vscode或者其他编译器打开!!!
搭建脚手架的方式网上多种多样,并不唯一!!!仅供参考!!!