mdp-ui组件库：前端工程与目录结构规范

"API.md 是一个关于mdp-ui组件库的说明文档，主要涵盖了前端和后端工程的命名规范以及前端项目的目录结构。mdp-ui是一个基础组件库，还包含了一个扩展组件库MdpExt，用于根据业务需求定制组件。文档中详细列出了前端项目中的各个目录及其用途，例如api目录用于存放与后端交互的接口，Mdp和MdpExt分别存储基础和扩展组件，还有mock目录用于模拟接口数据等。此外，项目还遵循了一些配置文件和版本控制的约定。" 在这个API.md文档中，我们可以了解到以下几个重要的知识点： 1. **工程命名规范**： - 前端工程通常按照“业务名-ui-web”、“业务名-ui-app”等模式命名，其中“-web”表示电脑浏览器应用，“-app”表示手机应用，“-uniapp”表示小程序或跨平台应用。 - 后端工程则命名为“业务名-backend”，如有需要，可以添加“-ui”、“-web”等后缀以区分其角色。 2. **前端目录结构**： - `build`：包含编译构建相关的脚本和配置。 - `config`：存放编译构建的配置文件。 - `dist`：编译后的产出物，即部署到生产环境的文件。 - `src`：源代码目录，所有开发代码位于此目录。 - `api`：定义与后端交互的API接口，每个接口一个文件，公共API存入`fly.js`。 - `fly.js`：全局注册公共API，方便在页面上调用。 - `assets`：存储静态资源如图片、字体等。 - `common`：公共JS脚本。 - `components`：组件库，包括基础组件库`Mdp`和扩展组件库`MdpExt`。 - `directive`：自定义Vue指令。 - `icons`：图标库。 - `lang`：语言包，支持多语言切换。 - `mock`：模拟接口数据，用于开发阶段。 - `router`：路由管理模块。 - `store`：全局公共数据库，可能使用Vuex实现。 - `styles`：CSS样式库。 - `views`：业务功能的页面代码。 - `vuex`：Vuex状态管理库。 - `App.vue`：项目主入口Vue组件。 - `main.js`：项目主入口JS。 - `permission.js`：路由菜单权限过滤逻辑。 - `static`：存放部分静态资源。 - 其他配置文件和说明文件，如`.editorconfig`、`.gitattributes`、`README.md`等。 3. **组件库**： - `Mdp`是基础组件库，包含了项目常用的基础组件。 - `MdpExt`是扩展组件库，用于根据业务需求开发的特定组件，不包含在基础组件库内。 4. **接口管理**： - 接口文件按表名分文件存储在`api`目录，便于管理和维护。 - `fly.js`中注册的公共API可以直接通过`$fly.xxxxApi()`在页面上使用，简化了API调用的导入过程。 5. **其他辅助工具**： - `mock`目录的模拟数据有助于在开发阶段快速测试。 - `permission.js`实现了路由菜单权限过滤，确保只有具有相应权限的用户才能访问特定路由。 这个文档对于理解mdp-ui组件库的组织结构和开发流程非常有帮助，有助于开发者快速上手和协作开发。