前端 SDK
前端 SDK(Software Development Kit)是为浏览器应用设计的工具包,以 TypeScript 为核心,提供封装好的 API、Hooks、Service 以及组件
设计理念
基于服务端主流的MVC分层架构,在设计前端SDK的时候,也考虑到我们围绕 「分层解耦 模型驱动 多端复用」设计sdk,
分层解耦:将sdk分为不同的层级,每个层级负责不同的功能,互不干扰,方便维护和扩展。
- UI组件层:提供
@swing/widget-vue3业务组件库和@swing/arenas-vue3无状态的UI组件库,方便前端开发人员快速集成和使用。 - Hooks视图层: 按照vue3和react等主流前端框架推行的hooks规范,提供
可复用的代码片段,方便前端开发人员快速集成和使用。 - Service服务层:基于Fetch和Axios等主流的http请求库,对
API接口进行封装,提供统一的接口调用方式,方便前端开发人员调用。 - Schema模型层:为了更好的类型提示和编译期类型检查,提供
封装好的模型,方便前端开发人员使用。
- UI组件层:提供
模型驱动:sdk的设计基于模型驱动,即根据业务模型来设计sdk的接口和功能,确保sdk的功能与业务需求一致。
- 通用模型:通用模型主要维护在
@swing/core-vue3中,它提供了一些通用的模型,如分页模型、列表模型、Swing平台基础的DTO/VO/Query等模型等。 - 平台模型:平台模型主要维护了Swing平台内置的模型,如
@swing/system-vue3系统模型、角色模型、组织模型、工作流模型、定时任务模型、消息模型等基础设施。
- 通用模型:通用模型主要维护在
多端复用:sdk的设计考虑到PC和h5等多端复用,即能够在不同的前端项目中复用,减少重复开发的工作量。

推荐方案
在进行日常业务开发的过程中,我们推荐使用以下方案:
- 将页面细小功能进行
组件化拆分 - swing平台的SDK提供的组件包含一下三类
- 开源的三方组件
Ant Design vue - 纯数据展示的无状态组件库
@swing/arenas-vue3 - 业务组件库
@swing/widget-vue3
- 开源的三方组件
- 基于SDK的设计理念,我们推荐在组件中使用Hooks,在Hooks中使用Service,更好的对代码进行解耦和复用。


