tengits-ui5

webpack5 / antd5 搭建的组件库

测试

npm run dev

UI查看测试

npm run storybook

打包

npm run build

查看storybook

https://www.chromatic.com/library?appId=650a60cf4d4736816a2ad843&inviteToken=chpi_0ff1e46bb2364ed8beaeb987a997303e

git commit 说明

• commit 规范依据：https://www.conventionalcommits.org/zh-hans/v1.0.0/
• 约束提交规范：husky + commitlint
• ci 发布相关工具：https://github.com/semantic-release/semantic-release

格式

<type>[optional scope]: <description>

[optional body]

[optional footer(s)]

例子

# 修复bug 1.1.1 > 1.1.2
fix: 修复xxx方法空值报错

# 新需求 1.1.x > 1.2.x
feat: 新增用户管理

feat(components): 新增 Input 组件

# 破坏性变更 1.x.x > 2.x.x
perf(pencil): remove graphiteWidth option

BREAKING CHANGE: The graphiteWidth option has been removed.
The default graphite width of 10mm is always used for performance reasons

其他提交类型 build: chore: ci: docs: style: refactor: test:

context

• 父子组件，或者夸层级，需要共享数据，需要context
• 底层级消费高层context
• TUIApp 可传各个 context 初始化数据
• 需要修改context，调用各个context 的 dispatch

AppConfigContext // 应用配置：应用名称，功能配置，修改密码接口等 UserContext // 用户角色权限，甚至主题等，需要持久化 ThemeContext // theme，需要持久化 ConfigProvider // and 的 ConfigProvider App // and 的 App RouterProvider // react router 的 RouterProvider LayoutContext // layout Component // 自定义页面/组件

路由

父级有路由，还有children

• /*
• children 包含一个 path为空字符串的路由，用来匹配父级路由

图标库

TUIIcon

使用阿里图标库

TUIIconPark

createFromIconfontCN 只会引入阿里的图标库

• 项目使用 请引入

<script src="https://static-1255466169.cos.ap-guangzhou.myqcloud.com/assets/fonts/iconpark.js"></script>

• 图标更新需要更新 对应的 腾讯云