web前端项目的api模块化与聚合管理

开发场景

在平时的开发过程中，我们可能会将api放到不同的文件中。例如用户管理相关的接口放置在一个文件中，权限管理放置在一个文件中等等，每一个模块相关的接口都会单独的放置在一个文件中，这个时候，当我们引用接口是，就会从不同的文件中进行引用，如下图：

image.png

这个时候，我们会发现，接口的定义与界面的引用实际上是有些混乱的，而且这里有可能同一个接口在多个文件中被定义，其实也是非必要的。

改进方案

那么，如何将这种混乱的状态理清楚呢？那就是将多文件的接口聚合，如下图：

image.png

这样子是不是就清楚得多了？

具体实现（vue3）

这里就直接拷贝代码截图了

将多个文件进行聚合

image.png

引用示例