前言
鉴于现在好多类似教程都过时了，如果按照教程来会导致各种各样的错误，所以，本篇文章有效期为标题标注的年份。
1. 环境配置
node： v12.16.0 现在最新是v12.18.0 下载地址
yarn： 1.22.4 (可选)不用yarn，直接用node自带的npm也一样 下载地址
在cmd命令行里输入上图中的指令，可以显示版本，即为环境配置到位了。
2. 起步-脚手架搭建起来
如果有时间，可以把vue官方教程看一下，我没看完，只看到了 “计算属性和侦听器”这一节，等我先把最基础的框架搭好了，再去看也不迟。
我在之前有篇文章 vue学习入门篇 中，大概了解了一下vue的用法，其他方面对vue现在还不熟，不过不影响我继续用vue撸管理后台。
vue的cli脚手架分两个大的版本区别：2.x 及以下版本叫 vue-cli，3.x 及以上版本叫 @vue/cli。由于 2.x 系列要配合webpack、babel 等工具使用的话，需要开发者自己去配置，挺麻烦，增加了入门难度。官方就从 3.x 开始，做一些桥接，把webpack、babel这些配置细节给封装了起来，极大降低了入门开发者的配置门槛。
目前大部分的教程和文章都是旧版本( 1.x、2.x )的配置方式，刚开始对我的学习也产生了困扰，翻查了一些资料，才明白了这其中的区别，这里点出来，让初入门的开发者少走弯路。
2.1 安装@vue/cli
目前 @vue/cli 的最新版本是 4.3.1，我也是升级到了这个版本。
两种安装方式，选择一种即可：
npm install -g @vue/cli (-g 表示全局安装)
or
yarn global add @vue/cli (yarn全局安装)
安装好以后，命令行输入以下图中的命令，看到类似下面的版本信息输出，即为安装到位。
注意：如果全局安装了 vue cli 的1.x 2.x版本，需要先卸载旧版，再安装新版，详情看官方安装文档
2.2 创建管理后台项目
在命令行执行：
vue create my-admin会有一个交互式的信息(下图)，让我们选择，初次学习，我们直接按两次“回车”选择默认的就行，为啥，因为 vue-router 、 vuex 都还没看，谁知道怎么用啊，对吧。后面用到了再来安装就好了。
这个图片显示，vue cli有最新版本了 4.4.1，更新好快啊，我还在用 4.3.1 边学边写教程也。
这个版本应该是兼容的，我们直接运行 yarn global add @vue/cli 升到 4.4.1 再继续写教程。
升级到 4.4.1 了，继续撸。把刚生成了my-admin项目删了，用 vue create my-admin 重新创建一下项目。
好像和 @vue/cli 4.3.1 版生成的项目也没什么区别嘛，继续撸。
其实这时我们的用户目录下 C:\Users[Jerry]\ 已经生成了一个 .vuerc 配置文件，记录了我们刚才选择的配置(下图)。
我看配置中，有个使用淘宝镜像源怎么默认为 false 呢，强迫症表示我得打开文件把它改为 true，虽然不知道这个配置什么时候会用，先改了总是没错，而且我的yarn已经配置了淘宝镜像源，具体教程可以看我另一篇文章 《前端开发必备之国内镜像源》。
改为 true 了，继续撸。
上图就是通过官方命令生成的最基本的项目代码。
在命令行执行：
cd vue-adminyarn serve
稍等片刻，如果代码没错误的话，运行完就会显示类似上图这样的信息。
在浏览器中打开上图的链接，就可以看到这个 demo 输出的默认内容。
3. 后记
第一章节的内容就先到这里了，内容不多，主要是一些旁枝末节的东西，如果不明白或不熟悉的话，很影响进度，我为此也查了很多资料，才把这些东西串联起来。写这篇文章花了两个小时，还是挺耗费精力的呀。
--End--