为了能够快速且系统的理解脚手架，接下来分6个步骤介绍vue脚手架，分别是
1 脚手架的作用，
2 脚手架的安装，
3 脚手架的图形界面，
4 脚手架需要安装的插件，
5 脚手架的项目结构，
6 脚手架的功能语法。
1、vuecli的作用:
前端开发时，文件杂乱无章，vue脚手架把跟vue相关的工具集合到一起，方便前端的开发。
2、脚手架的安装:
因为脚手架的一系列工具基于node，所以先安装node，然后通过工具内部存在的npm指令去安装vue。
去官方网站下载最新的node，直接搜这个词，进入官网下载即可，也不拉个网站了。
下载好以后，windiws+R敲cmd命令，然后输入npm-v查看npm的版本。
然后改远程仓库的淘宝镜像，需要输入的永久配置命令是:
npm config set registry https://registry.npm.taobao.org
然后去vue官方，查看npm下载vue的命令敲入: npm install-g @vue/cli 等待下载。
下载完以后，可以敲入vue-v查看版本
3、进入vue的图形界面创建项目:
进去cmd命令，然后敲vue ui 回车进入vue的图形界面。然后创建我们的第一个项目。创建项目按步骤走，其中有个选项需要勾选，如图
Router需要勾选，Linter需要反选。
4、安装插件和依赖:
在vue ui的界面选择插件和依赖的项，然后进入搜索，下载个相应的插件和依赖。
插件需要安装的是: element ui
依赖需要安装的是: qs，axios，echarts等
5、脚手架项目结构:
把创建好的项目文件拉入随意编辑器，我拉的是HBuider，以下是文件的项目结构，主要是src这个文件夹，里面是需要修改和编辑的文件目录。
上图是src的下级目录
assets目录主要放一些图片类的东西
components目录放的是要实现页面功能的文件。
router目录放的是路由文件，主要是用来增加一些文件的访问路径。
App文件是主页面文件，需要配置便签以显示自己创建的页面功能，原来带的一些不需要的代码可以删掉。
main文件是入口文件，主要配置一些重要的参数。
项目中有几个示例的欢迎文件，可以删掉，并把自己的页面配置在路由中。
上图是页面功能编写的文件页面，分三个便签部分，各个部分编写各部分的语法。
6、脚手架的一些功能语法:
★export default { }
this.$axios
this.$qs
this.$router.push("/main1"); 跳转命令
★router： 路由配置功能文件路径
import Main from '@/components/main1.vue'
{path: '/main1',component: Main}
{path:'/',redirect:'/login'},
★app.vue根组件设置:
<router-view></router-view>
★main.js项目入口文件设置:
运行项目时自动执行
import axios from 'axios'
import qs from 'qs'
Vue.prototype.$axios = axios
Vue.prototype.$qs = qs
axios.defaults.withCredentials = true;（跨域cookie）
axios.defaults.baseURL = 'http://localhost:8080'; （全局路径）
★子路由设置
children:[ 路径 ]
<router-view></router-view>（在想要展示的地方加）在导航条属性上加：router
