VueCLI3的使用：

VueCLI3与Vuecli2的使用略有不同。

cli3相比cli2的优势：

1：功能丰富：对babel、Typescript、ESLint...提供开箱即用的支持

2：易于扩展：它的插件系统可以让社区根据需求构建和共享可复用的解决方案

3：无需Eject：vue cli 完全可配置的，无需再使用webpack配置

4：CLI图形化界面：vue ui图形化界面创建、开发和管理项目

5：即刻创建原型：用单个vue文件实现新的灵感

6：面向未来：为现代浏览器轻松产出原生的ES2015代码，或将你的vue组件构建为原生的Web Components组件

一：安装：

npm install -g @vue/cli

安装之后，就可以在命令行中访问 vue 命令。你可以通过简单运行 vue，看看是否展示出了一份所有可用命令的帮助信息，来验证它是否安装成功。

你还可以用vue --version来检查其版本是否正确 (3.x)。

二：使用Vuecli3创建vue项目： 

在cli2中创建项目的命令是：vue init webpack name。而cli3中只需：vue create name：

此时会被提示选取一个 preset。你可以选默认的包含了基本的 Babel + ESLint 设置的 preset，也可以选“手动选择特性”来选取需要的特性。默认的设置非常适合快速创建一个新项目的原型，而手动设置则提供了更多的选项，它们是面向生产的项目更加需要的。我们选择手动，而非默认。

选择配置：

空格键是选中与取消，A键是全选。

TypeScript：是支持ts书写源码

Progressive Web App (PWA) Support PWA 支持。

Router 支持 vue-router 。

Vuex 支持 vuex 。

CSS Pre-processors 支持 CSS 预处理器。

Linter / Formatter 支持代码风格检查和格式化。

Unit Testing 支持单元测试。

E2E Testing 支持 E2E 测试。

我选择了router,vuex,css预编译：less，Linter/Formatter。

选择语法检查方式，我自己选择保存就检测，第一个是保存检测，第二个是fix和commit的时候检测：

配置文件存放地方第一个是独立文件夹位置，第二个是在package.json文件里：

然后提示是否将本次配置保存为预置以供将来的项目使用：

完成配置后回车等待下载。装好后首先cd到项目目录下，然后npm run serve运行：

成功使用cli3创建并运行了一个vue项目：

三：cli2与cli3项目结构：

左边为cli3创建的项目，右边为cli2创建的项目，我们可以发现cli3创建的项目结构更加的简洁。因为：vue-cli3.0致力于Vue生态中的工具基础标准化。它确保了各种构建工具能够基于智能的默认配置即可平稳衔接，这样你就可以专注在撰写应用上，减少配置的时间。查看如下文件，会发现相比于vue-cli2.0少了build与config文件夹，所以vue-cli3提供了一个可选的配置文件 ——vue.config.js。

结构说明：