我今天查阅了GitHub上Star最高的若干个Vue.js项目，整理了一份最普遍的src目录的结构。
api目录
api目录中会有一个或多个js文件，作用是抓取服务器端的API。
assets目录
通常，assets目录中会有css、js、img等目录，存放库文件，和自定义的全局文件。
components目录
components目录顾名思义是存放组件，组件的一大特征是“可复用”，所以大多数人的习惯是只放全局组件和可复用的组件。
例如，一个SPA通常有页头、页尾，每一页都有，这样就可以有2个组件：Head.vue和Foot.vue。
如果导航区域在多个页面中都有，只在个别页面中没有，也可以放进来。
如果某个组件确实只为1、2个页面服务，习惯是放到下面的pages文件夹。
config目录
一个可以良好维护的项目，必须应该有一个config文件夹，它存放的是各种配置文件，经过调查，出现最多的文件是： env.js 、 fetch.js 、 rem.js 、 mUtils.js ，它们的作用也很明确。
pages目录
有的项目叫view目录，这个最好理解，就是人视觉主观认为的页面。
这里通常是建立文件夹，每一个页面一个文件夹，比如首页是home文件夹，它里面又会有Home.vue以及它的组件（如果有的话）。
这里有个有意思的现象，有些人习惯于将Home.vue继续拆分组件，有些人不愿意拆分，这个事其实视情况而定：
- 不拆分的理由：不拆分，就不涉及组件间数据传递，简化编程逻辑。
- 拆分的理由：代码段清晰，尤其是大型项目，不拆分的话每个页面组件有上千行代码，这时候拆分较好。
如果拆分的话，目录可以这样：
admin
- Index.vue
- index-components
- - xxx.vue
- - ooo.vue
- Staff.vue
- staff-components
- - xxx.vue
- - ooo.vue
router目录
不多说，因为它是vue-cli默认生成的目录。
store目录
store目录负责全局状态管理，一般是记录用户的所有操作以及导致的结果。
总结
我调查的大部分项目都是按照这样的目录结构来做的，如果你不知道该怎么创建src子目录，可以参考一下。
