【源码】基于Vue和Yarn Workspaces的模块化API管理系统

项目简介

本项目是基于Vue和Yarn Workspaces构建的模块化API管理系统，目的在于简化API接口的管理与使用。借助模块化开发、环境变量管理以及反向代理等功能，开发者能够轻松管理不同环境下的API配置，快速开展业务逻辑开发。项目采用monorepo结构，支持多模块复用与统一管理，适用于中大型前端项目开发。

项目的主要特性和功能

1. 模块化开发：运用monorepo结构，通过Yarn Workspaces管理多个模块，支持模块间依赖共享与独立开发。
2. 环境变量管理：可通过 .env.dev、.env.prod 和 .env.mock 文件配置不同环境下的变量，如API基础URL。
3. API管理与反向代理：具备内置API管理功能，支持通过环境变量动态配置API基础URL，简化跨域请求处理，每个API有明确类型定义，便于调用和维护。
4. 主题换肤功能：基于 ant-design-vue 的主题系统，支持通过CSS变量自定义主题颜色，提升UI灵活性。
5. 代码风格统一：集成Prettier进行代码格式化，保证代码风格一致，提高代码可读性和可维护性。

安装使用步骤

安装依赖

• 确保已安装 yarn，若未安装，运行 npm i yarn -g 进行全局安装。
• 在项目根目录下运行 yarn install 安装所有依赖。

配置环境变量

• 在 packages 目录下的子项目根目录中创建 .env.dev、.env.prod 和 .env.mock 文件，配置相应环境变量。
• 确保配置了 NODE_ENV、BASE_URL 和以 VUE_APP_ 开头的变量。

运行项目

• 开发环境：运行 yarn dev 启动前端开发服务器。
• 模拟环境：运行 yarn mock 启动模拟环境。
• 生产环境：运行 yarn build 进行生产环境打包。

使用API

• 通过配置好的环境变量调用API，开展业务逻辑开发。
• 每个API的接口类型定义在 types/api 目录下，确保接口调用时类型正确。

下载地址

点击下载 【提取码: 4003】【解压密码: www.makuang.net】