boty-design:react 组件库|组件库学习|从零造轮子|pc组件库
2023-02-22 09:36:23
预览
README
boty-design
从零打造一套企业级react 组件库生态
文档
安装
$ npm install @boty-design/components --save
$ yarn add @boty-design/components
$ pnpm i @boty-design/components
使用
import { Button } from "@boty-design/components";
const App = () => (
<Button onClick={handlerSyncClick} loading={true} >
异步按钮
</Button>
);
技术
- 框架支持【react】 https://zh-hans.reactjs.org/
- 组件学习【ant design】 https://ant.design/index-cn
- 本地开发【vite】 https://cn.vitejs.dev/
- 项目文档【umi文档】 https://d.umijs.org/zh-CN
- 持续集成【Travis CI】 https://travis-ci.org
- 持续部署【 github Aciton】 https://docs.github.com/cn/actions
- npm管理【lerna】https://github.com/lerna/lerna
- 组件生成【plop】https://github.com/plopjs/plop
待做清单
✅ 已完成 ⭐️ 完善中 ❌ 未开始
通用
- Button 按钮 ⭐️
- Layout 布局 ❌
- Icon 图标 ❌
表单
- Form 表单组 ⭐️
- Field 表单单位 ⭐️
- Input 输入框 ❌
- Radio单选框 ❌
- Switch开关 ❌
- Checkbox多选框 ❌
- Select 选择器 ❌
- Slider 滑块 ❌
- TimePicker 时间选择器 ❌
- DatePicker 日期选择器 ❌
- DateTimePicker 日期时间选择器 ❌
- Upload 上传 ❌
数据
- Table 表格 ❌
- tree 树 ❌
- Tag 标签 ❌
- Progress 进度条 ❌
- Pagination 分页 ❌
- Badge 标记 ❌
交互
- Dialog 对话框 ❌
- MessageBox 弹框 ❌
- Drawer 抽屉 ❌
- Calendar 日历 ❌
- Carousel 轮播走马灯 ❌
反馈
- Message 消息提示 ❌
- loading 加载 ❌
- Notification 通知 ❌