Antd-MS —— 基于 Ant Design 二次封装的 React 业务组件库,让中台开发更简单。
文档站点 · 组件总览 · 更新日志 · Report Bug · Request Feature
- 📦 开箱即用 —— 40+ 业务组件、40+ 字段组件,覆盖中后台高频场景。
- 🛡 TypeScript —— 全量 TypeScript 编写,提供完整的类型定义与智能提示。
- 🎨 主题定制 —— 基于 less 变量与 ConfigProvider,轻松适配业务品牌色。
- 🌍 国际化 —— 内置多语言能力,支持按需扩展。
- 🧩 Schema 驱动 —— 配套 schema-render 渲染引擎,配置即页面。
- 📐 设计规范 —— 统一的设计语言与交互规范,保持中台一致性。
- 现代浏览器
- 服务端渲染(SSR)
![]() Edge |
![]() Firefox |
![]() Chrome |
![]() Safari |
![]() Electron |
|---|---|---|---|---|
| last 2 versions | last 2 versions | 87+ | last 2 versions | last 2 versions |
# npm
npm install @jaytam/antd-ms
# yarn
yarn add @jaytam/antd-ms
# pnpm(推荐)
pnpm add @jaytam/antd-msimport { MsForm } from '@jaytam/antd-ms';
export default () => {
return (
<MsForm
columns={[
{
title: '姓名',
dataIndex: 'name',
},
]}
onFinish={async (values) => {
console.log(values);
}}
/>
);
};@jaytam/antd-ms 提供业务组件、字段组件以及布局、Hooks 等多种能力,全部组件与 API 请查阅组件总览。
本仓库采用 pnpm workspace 管理,除主包外还包含以下子包:
| 包名 | 说明 |
|---|---|
@jaytam/icons |
图标库 |
@jaytam/schema-render |
Schema 渲染引擎 |
@jaytam/ms-flow |
流程图组件 |
@jaytam/ms-gantt |
甘特图组件 |
推荐使用 Node.js 18+ 与 pnpm 包管理器。
# 克隆仓库
git clone https://github.com/JayTam/antd-ms.git
cd antd-ms
# 安装依赖
pnpm install
# 启动文档开发服务
pnpm start
# 构建组件库产物
pnpm build
# 构建文档站点
pnpm build:docs
# 代码检查(类型 / ESLint / Prettier)
pnpm lint
# 运行单元测试
pnpm test
# 运行测试并生成覆盖率报告
pnpm test:coverage
# 使用 Commitizen 规范化提交
pnpm commit打开浏览器访问 http://127.0.0.1:8000 即可预览文档站点。
本项目使用 Commitizen + commitlint 约束 Git 提交信息,请遵循 Conventional Commits 规范:
pnpm commit- React 18
- TypeScript 5
- Ant Design 4
- dumi 2 文档站点
- father 4 组件库构建
- Jest + @testing-library/react 单元测试
欢迎参与共建,让 antd-ms 更好。
- 提交 Issue:https://github.com/JayTam/antd-ms/issues
- 提交 Pull Request:https://github.com/JayTam/antd-ms/pulls
- 提交 PR 前请确保
pnpm lint与pnpm test通过 - 请阅读 Conventional Commits 规范后再提交
详细的版本变更记录请查看 CHANGELOG.md。
- GitHub Discussions:https://github.com/JayTam/antd-ms/discussions
- GitHub Issues:https://github.com/JayTam/antd-ms/issues




