我以前就熟悉如何使用vue-cli创建一个新项目。有关详细信息，请参见vue简介：使用vue-cil创建一个新的vue项目。现在，我们设计正在开发的特定项目的整体架构。在此之前，我们需要学习和掌握vue的基础知识，这些知识可以在vue的官方文件中详细找到。
首先，看看我们的项目结构图。
项目总体结构
这个vue项目的结构已经在vue-cli生成的默认结构中进行了调整，各个文件模块的具体功能将在后面的文档中进行说明。
1.在根目录中创建一个新的模拟文件夹，并将index.js和util.js添加到该文件夹中。主要用于前端项目提供测试接口和数据。
2.在src文件夹下创建一个新的api文件夹，并将index.js和api.js添加到该文件夹中。主要用于统一封装和管理项目中的所有api接口。
3.在src文件夹下创建了一个新的axios文件夹，并将index.js添加到该文件夹中。它主要用于拦截和封装请求。
4.在src文件夹下创建一个新的公共文件夹，主要用于存储公共组件和方法。
5.src文件夹下会创建一个新的pages文件夹，主要用于存储构建页面的组件。
6.src下的router文件夹主要用于管理项目中的所有路由，以及封装路由拦截等。
7.src文件夹下新建一个store文件夹，主要用于vuex项目的状态管理。
8.静态文件夹添加config.js，主要用于vue项目中的配置，比如api接口地址等。打包发布后，静态文件将被保留。
新结构建成后，我们以后会对各个结构的功能分别进行补充和完善。