vue-cli 官方解释是，它是一个基于 vue.js 进行快速开发的完整系统，提供：

• 通过 @vue/cli 搭建交互式的项目脚手架。
• 通过 @vue/cli + @vue/cli-service-global 快速开始零配置原型开发。
• 一个运行时依赖 (@vue/cli-service)，该依赖：
  • 可升级；
  • 基于 webpack 构建，并带有合理的默认配置；
  • 可以通过项目内的配置文件进行配置；
  • 可以通过插件进行扩展。
• 一个丰富的官方插件集合，集成了前端生态中最好的工具。
• 一套完全图形化的创建和管理 Vue.js 项目的用户界面。

       接下来废话少说，我就直接说说 vue-cli 最新版本怎么安装，怎么新建项目。

1.  安装 Vue Cli

1. 关于旧版本
Vue Cli 的包名称由 vue-cli 改成了 @vue/cli。如果你已经全局安装了旧版本的 vue-cli(1.x 或 2.x)，你需要先通过 npm uninstall vue-cli -g 卸载它。(注：安装 linux 系统的注意一下，包括深度以及 ubuntu 用户，执行这句命令前，需要添加 sudo 来给这条语句一个执行权限)

2. Node 版本要求
Vue Cli 需要 Node.js 8.9 或更高版本。目前我电脑中安装的是 8.12.0 版本。windows 系统的小伙伴们可以直接在 node 官网下载安装包进行安装。但是 linux 系统的小伙伴们就没那么幸运了，即使是下载了 node 官方的压缩包，大家还是一脸懵逼，不知道怎么用。这里做个小插曲，给大家以 ubuntu 版本的 liunx 系统为例，讲一下怎么升级 node.js 到最新稳定版本。

3. node.js 中文版官方网址
ubuntu 官方包管理中，node.js 最新版本是 8.10.0 版本，因为我们是一群患有重度强迫症的程序员，总是会在有新的稳定版本的东西出来后，就要更换，所以官方源中的版本并不满足于我们，so，我们要从其他源中来下载最新且稳定的版本。
首先打开我们的终端，然后在里面执行 curl -sL https://deb.nodesource.com/setup_8.x | sudo -E bash - 这句命令，来获取最新的下载安装源，之后输入 sudo apt-get install -y nodejs 来安装最新版本的 node.js。安装成功之后，我们执行 node -v 来看一下版本。(v8.12.0)

        好，收！有点跑题了，有兴趣的小伙伴可以私下试一试，注：如果系统不小心瘫痪，本人概不负责 (开个玩笑哈，我已经试验成功了，不然就不会写这篇文章了)

        接下来，我们就来说说怎么安装最新版的 vue-cli。其实很简单，就一句命令：npm install @vue/cli -g (啊，是的，我又要写注意了，其实就是想提醒一下 linux 系统的小伙伴，别忘了加 sudo 给权限。O(∩_∩)O)

        安装之后，你就可以在命令行中访问 vue 命令。你可以通过简单运行 vue，看看是否展示出了一份所有可用命令的帮助信息，来验证它是否安装成功。当然，你还可以用下面这个命令来检查其版本是否正确 (3.x):

vue --version

        到此为止，Vue Cli 就安装成功了，但是...emmm... 你以为安装成功就大功告成了么？嘿嘿，接下来的坑，你们不想跳都不行了，恭喜你，成功进入天坑 ~~~

        2.  创建一个项目

         vue create

        来，我们运行以下命令来创建一个新项目：

vue create hello-world

        小伙伴们，这里有个坑，就是你新建项目的时候，不能用驼峰方式命名项目名称了，它会报错的，只能用全小写外加下划线的方式。不信邪的小伙伴们可以试试哈，要是成功了记得告诉我一声，让我也开心一下 ~~~

        接下来我就讲讲具体怎么创建项目：

• 首先，我们在终端里输入命令，然后回车，出现以下界面：

        这里我选择的是自定义安装，也就是第二个。

• 接下来进入第二步，选择你需要的模块。

        因为个人习惯的问题，我选择的是 babel、Router、Vuex、Linter/Formatter、unit Testing、E2E Testing。选择完成后，就按回车进入下一步。

• 接下来会让你进行一系列的框架或插件版本选择，首先是路由部分

        因为我的项目不需要，所以我选择了 n。

• eslint 配置

        这里我选择的是第三个，标准配置。

• 检查设置

        我在这里选择的是第一个，在保存的时候检查。第二个的意思是在提交的时候检查。根据个人需要来选择吧。

• 单元测试

        前端的单元测试目前有两个比较热的框架，一个是 karma+mocha+chai 的方式，一个是 jest。根据个人习惯选择就好，因为我比较喜欢第一种，所以我选择的是第一种。小伙伴们不用急，关于单元测试这块，我会找时间写博客的。

• e2e(端到端测试)

        关于 e2e 测试，做前端开发的小伙伴有些可能对 e2e 测试没什么概念，我这里简单说一下这是做什么的。e2e，中文解释为端到端测试。首先前端的测试分为两种，一个是单元测试，另一个就是 e2e 测试了。e2e 测试主要是来测试页面的业务逻辑，主要注重用户体验。可以模仿用户在页面的点点点操作。有兴趣的小伙伴可以专门学一下。这里就不在赘述了。

        因为个人习惯吧，我比较喜欢用 nightwatch 框架，语法简洁，比较容易理解，至于 Cypress 框架，本人没有接触过，所以不敢妄加评论。有会的小伙伴可以教教我哈 ~~~~

• 配置文件存放

        这里是在问你，怎么存放这些配置文件。第一个是单独存放，第二个是集成在 package.json。我选择第一个，单独存放。

• 保存当前配置

        这里是在询问你是否保存当前配置，我选择的是否。你也可以根据你的习惯选择是，下一个在创建项目的时候，就会出现一个你保存过的配置选项。

        选择完成后，项目就会自动创建，并且会默认安装你选择的这些插件或模块。到此为止，项目就算创建完成了。但是，哈哈哈，是的，还有个坑在等着你们 ~~~ 创建过 vue 项目的小伙伴有没有遇到过安装 chromedriver 时，报错的？肯定有...

        就比如上图中的错误。这个问题网上有一堆教程，有的会说，用 npm install chromedriver –chromedriver_cdnurl=http://cdn.npm.taobao.org/dist/chromedriver 这个命令就行了。没错，你在单独安装这个插件的时候，可以用这个命令，但是咱们这是用 @vue/cli 命令在创建项目啊，如果这一步过不去，后面的就全都失败了，你打开项目文件夹之后就会傻眼了，里面除了一个 package.json 还有个 node_module 文件夹，这是项目创建失败的表现。这可咋整 ~~~ 别急，这个错误的出现可能是因为 FQ 的问题，有的小伙伴会说，我电脑安装了 FQ 软件了啊？可是，这个是通过 npm 管理器进行安装的，并不是所有 FQ 软件都能让它正常运行。所以我们需要在本地全局配置一下 chormedriver 源，打开终端就一个命令：npm config set chromedriver_cdnurl=http://cdn.npm.taobao.org/dist/chromedriver。然后在重新建项目就会发现一次性通过，堪称完美 ~~~

        进入到这一步，就说明你已经成功了。然后我们打开项目目录：

        左侧是新建好的项目，但右侧是 vue-cli 2.x 版本创建的目录。我们看到，新建的项目没有了 build 和 config 文件夹。这也是 @vue/cli 3.0 的新特性，一些 webpack 打包的配置，我们可以自己动手去配置了，正好也给了我们学 webpack 的机会。这里就先不讲新项目的 webpack 配置了，有兴趣的小伙伴可以自己研究着配置。我下篇博客会讲新项目究竟如何配置 webpack。敬请期待 ~~~~