我觉得---对于初学者来说，首先应该是先知道为什么要搭建脚手架vue-cli，然后再进行搭建...
什么是脚手架，搭建的目的是什么？
在工地上，脚手架是帮助工人作业搭建的架子，哈哈...
所以在这里， vue-cli 就是脚手架，里面有一套vue结构配置，它可以帮助我们写好vue.js代码快速构建项目的工具。
vue-cli可以做什么：
1，目录结构
2，本地调试
3，代码部署
4，热更新
5，单元测试（ESlint）
目的：节省时间，快速开启项目。
搭建步骤
这里是简洁版：https：//blog.csdn.net/webkris/article/details/80023552第一步，环境搭建和准备工具
1.--------------安装的node.js中（运行环境）----------------
从node.js官网下载并安装node，安装过程傻瓜式点击“下一步”就可以了。安装完成之后，打开命令行工具（win + r，然后输入cmd），输入node -v，如下图，如果出现相应的安装版本号，说明安装成功。
2 .-----------安装淘宝镜像（为了安装cnpm）------------------
打开命令行输入 npm install -g cnpm -registry = https：//registry.npm.taobao.org
注意我们要用cnpm，因为用的npm的服务器是外国，安装速度很慢，且npm命令执行效率会比较慢。
下面是安装进度，需要有网，速度也是你的网速决定的。
安装完成之后，cnpm -v如下图，出现相应的版本号，则说明安装成功;如果安装不成功，检查是否报错，如果没有报错，但是cnpm -v时显示“ 不是内部或外部命令，... ......... “，那就去检查windows环境配置，把vue.cmd文件的路径名配置到路径后面，如下图：
配置好之后，重启cmd，然后重新安装cnpm，检测cnpm -v，出现下图。
3 .--------------- 安装的WebPack（模块加载器兼打包工具）----------------
在命令行输入：cnpm install webpack -g
安装完成之后输入 webpack -v，如下图，如果出现相应的版本号，则说明安装成功。
4 .-------------- 安装vue-cli脚手架（一套配置服务）----------------------- -
在命令行输入：npm install vue-cli -g
完成之后，vue -V这里V大写，查看是否安装成功，如下图，出现相应的版本号，则说明安装成功。
第二步，使用vue-cli来构建项目
1. 新建文件夹
在硬盘上找到一个文件夹放工程用的。可以在D / E ...盘，文件夹名字尽量语义化就好，如：app等。在哪个盘里就转到哪个盘：D盘就是 d ：
然后指定到相关目录：cd目录路径（把刚才建好的文件名，如app 拖拽到命令行
显示如下图：
2. 创建项目
现在可以在你的文件夹如 应用程序 中创建项目：这里项目名不能使用大写和中文，只能是小写字母。
在命令行输入：vue init webpack my-vue 注意这里的“ my-vue ”是项目的名称，可以随便的起名，依然语义化就好。
创建项目过程中，看问号那里，我改了作者是我的名字kris，然后一直按“enter”，选择安装的部分，只有安装vue-router选择安装按'y'，其他都按'n';看我的图，英语不错的可以读读那些，看不懂的就按我说的做哈，总之不影响你后面创建项目〜
现在打开文件夹app，可以看到多了一个文件my-vue，这是刚创建的项目名称。
http：//localhost：8080 默认服务启动的是本地的8080端口，所以请确保你的8080端口不被别的程序所占用。
首次安装全步骤，如果已经安装，就直接执行
（1）d：
（2）cd:路径名
（3）npm install
(4) npm run dev
现在我们的脚手架就搭建完成啦〜如果有不严谨的地方或者过程中出现小问题的可以给我留言哦！