### 目录介绍
#### components
components里放置的是公共组件，每个组件有自己独立的文件夹，里面包含.vue文件和组件的images等静态资源文件夹。这样的好处是，可以在组件内部管理自己的html结构、样式和逻辑和静态资源。
components的结构如下：
```none
├── components
├── com1 # 组件1
├── images # 静态资源：图片
└── com1.vue # template/style/script
├── com2 # 组件1
├── images # 静态资源：图片
└── com2.vue # template/style/script
```
#### directives
directives文件夹中包含modules文件夹，和一个统一的入口index.js，modules里是不同指令的具体逻辑，index是所有指令的入口，方便在app.js中注册。index.js的代码如下：
```none
import directive1 from '.modules/directive1';
import directive2 from '.modules/directive2';
export default {
...directive1,
...directive2
}
```
#### routes
路由中包含map文件夹和入口文件index.js，map文件夹中根据模块来划分，每个模块单独一个路由配置文件，再在index.js中汇总，app.js中引入入口文件index.js就可以实现路由的注册。index.js中的代码大概如下：
```none
// 加载不同的模块
import order from './order'; // 订单
import log from './log';// 登陆
export default {
...order,
...log,
};
```
#### services
services下面根据模块，将所有API封装成方法，返回的是promise对象，在要用的地方直接调用方法就可以了。
#### views
views按模块划分，模块下面有页面，页面里面有静态资源和组件。上一个项目中，页面没有拆分组件，页面和组件的静态资源也都放到了asserts文件夹中。这次都放到了自身的对应文件夹下，管理起来方便了很多。结构如下:
```none
├── views
├── module1 # 模块1
│ ├── page1 # 页面
│ ├── components # 页面
│ ├── com1
│ ├── images // 组件1的静态资源
│ └── com1.vue # template/style/script
└── page1.vue # template/style/script
```
#### vuex
vuex使用的是[官方推荐](https://github.com/vuejs/vuex/blob/1.0/docs/zh-cn/structure.md)的项目结构,modules里面是各模块的js文件。
