相关项目 laravel-vue-iview 的 GitHub 地址 戳这里，此项目基本可用于实际开发工作。
基础篇主要介绍的是 Vue 前端项目的搭建过程，本篇将会介绍前端的文件结构和 jwt 用户验证功能。
考虑所有代码都写在这里，代码量太大的问题。建议下载 Github 的项目，这里只讲实现原理和思路。
文件结构
前端的文件结构基本大同小异，以我项目为例：
├── api // 接口
│ └── login.js
├── app.js
├── app.vue
├── bootstrap.js
├── components // 公共组件
│ └── ExampleComponent.vue
├── images // 图片资源
│ └── logo.jpg
├── lang // 多国语言
│ ├── en.js
│ ├── index.js
│ └── zh.js
├── libs // 代码库
│ └── util.js
├── router // 路由配置
│ ├── _import_development.js
│ ├── _import_production.js
│ ├── index.js
│ └── router.js
├── store // vuex 配置
│ ├── getters.js
│ ├── index.js
│ └── modules
├── styles // 公共 css
│ └── mixin.scss
├── utils // 公共函数库
│ ├── request.js
│ └── storage.js
└── views // 视图文件夹
├── home
├── layout
└── login
这里建议第一次学习时一次性创建好，在慢慢熟悉了这些结构之后，diy 自己的项目时就可以按需创建了。
JWT
如果你没有听说过 jwt，建议你简单了解一下 什么是 JWT – JSON WEB TOKEN。
Laravel 安装 JWT
这里官方地址已经足够精炼，点击 官方文档 查看。
当然，你也可以查看我之前写的一篇文章， Laravel5.5 安装 JWT。
用户登录模块
让我们先思考一下登录需要完成哪些工作：
输入用户信息 -> 发送请求到后端 -> 后端判断用户信息是否正确 -> 正确返回用户 token -> token 存储到 vuex 和 cookie 当中。