预备知识

vue-ui

创建者：李浩

以下是一些必备的相关知识：

1. Vue

Vue官方文档
至少要知道Vue的一些基础语法：v-for，v-if、v-else、v-show、v-bind、v-on、v-model等基础指令，了解filter、computed、watch等如何使用
最重要的是要了解vue的组件机制（因为我们现在的页面的每一块都会是一个组件）：包括如何注册组件，父子组件间如何通过props、$emit传值，slot和slot-scope等
对Vue的单文件组件要有所了解

2. vue-router

vue-router官方文档
单页面应用中不会再跳转页面，而是由vue-router来控制组件的展示

3. element-ui

element-ui组件库
这是饿了么官方开发的一套后台管理系统的组件库
你只需要简单看一下有哪些组件，需要的时候知道怎么用即可

4. vue-element-admin

vue-element-admin介绍
这个管理系统在webpack配置和代码规范方面还有适应桌面版后台管理系统方面做得很好
包括主题、权限验证、webpack打包等都做了很好的处理

5. es6

es6简明教程
es6其实是Javascript在2015年后的新的一些语法，项目的开发过程中大量的使用了es6来更好的简化开发，你至少要能看懂项目中使用到的箭头函数，模板字符串，import、export等语法

6. axios

axios是一个跨浏览器和node端的请求工具，可以拦截请求和响应，超时机制，取消请求等功能，在项目中我们已经封装在了this.$http方法中。如果你想发起一个请求：

this.$http('/getReportData')
    .then(res=>{
        console.log(res.data)
    })

更多详情可以查看：axios全攻略

以下是一些需要进行了解的相关知识

1.webpack

webpack其实是nodejs写的一个打包工具，它可以很好的整合项目使用到的所有资源：包括vue单文件组件、scss、将es6通过babel编译成IE等老旧浏览器下可运行的代码、图片、css和js的打包
它可以很好的区分开发环境和线上环境执行不同的操作，
开发阶段可以创建一个开发服务器，配置devServer的proxy可以在开发阶段帮助你代理请求，你就无需将页面放到对方的tomcat容器中去，当你修改代码后，页面会随时热更新，无需你手动刷新页面
上线阶段它会替你最大化的压缩打包项目中所有使用到的资源，未使用到的资源将不会最终打包成dist文件夹下的内容
你可以参考以下内容：入门 Webpack

2.vuex

vuex官方文档
在项目中我们使用了vuex来帮助我们在不同组件间管理状态

相关介绍

1. 关于如何运行该项目：

如果你从git上下载好了项目，你可以查看这个来将项目运行起来：

创建项目

2. node中间层

将来我们为了更好的协作，可以使用node中间层来更好的分离逻辑，
详情可以查看：

Node中间层实践（一）——基于NodeJS的全栈式开发
nodejs 中间层服务

3. 接口工具

后期我们可能会采用采用一些模拟的接口工具来更好的协作，在后台尚未开发好接口的情况下，我们可以使用一些相关工具：

生成接口文档：swagger
模拟接口：easy-mock

一些已经部署在内网的工具

1. swagger接口文档

你可以查看部署在内网的swagger接口文档

2. easy-mock

在后台接口未完成前，可以利用easy-mock结合swagger模拟一个接口服务，你可以登录后加入团队OPQ741