一、CLI3 创建项目

vue create 项目名

接下来弹出一个信息框：

?  Your connection to the default npm registry seems to be slow.   
   Use https://registry.npm.taobao.org for faster installation? Yes

由于我是在国内操作的，访问比较慢，所以弹出一个信息询问我们是否加速
我们选择 yes。

如果看到这行文字就说明你项目初始化成功。

接下来 npm run serve跑起来

这里有两个连接，一个是本地的(Local)，一个是局域网内都可以访问的(NetWork)

点开看一下：

二、入口文件对比

仔细看，差别就在 el与.$mount9''#app 这里，
在Vue源码内部，其实他们是没有差别的，只是判断了一下，如果你传入的是el，它内部其实使用的还是.$mount() 只是多了一层判断而已

三、目录结构详解

四、配置文件去哪里了？

4.1 我们启动 Vue UI 来查看。

打开任何一个终端
输入 vue ui

之后

然后点击导入这个文件夹。
即可来到这个界面，

点击左边对应的功能，即可看到我们项目中使用到的插件。

4.2 在隐藏的目录中查看

其实配置文件还是在的，只是“藏”起来了而已，
主要配置文件是在 @vue -> cli-service下的 Service.js

4.3 如何修改配置文件

方法一：我们可以通过图形化界面来修改，
方法二：我们可以在项目的根目录下 创建 vue.config.js文件，
这里我们以CLI3的方式配置别名路径：

const path = require('path');//引入path模块
function resolve(dir) {
  return path.join(__dirname, dir)//path.join(__dirname)设置绝对路径
}


module.exports = {

  chainWebpack: (config) => {
    config.resolve.alias
      .set("@", resolve("src"))
      .set("assets", resolve("src/assets"))
      .set("components", resolve("src/components"))
      .set("views", resolve("src/views"))
    //set第一个参数：设置的别名，第二个参数：设置的路径　　　　
  }
}

CLI3 会将该配置与已经存在的配置自动进行合并的。

注意：名字不能随便取，只能是vue.config.js

使用：

需要注意的时，在使用import方式的时候，我们的别名可以直接使用
但是如果时类似上边，通过url的方式的话，我们需要在前面加上~符号。