@shulex/design

Shulex UI 组件库

安装

npm install @shulex/design
# 或
pnpm add @shulex/design
# 或
yarn add @shulex/design

使用

1. 需要在根组件用ThemeProvider包一下
2. 按钮组件的type属性比antd多了solid、filled两个属性，其他组件使用方式都和antd一致
3. 参考antd文档：https://5x.ant.design/docs/spec/introduce-cn

import { ThemeProvider, Button, Dialog, Input } from '@shulex/design';

function App() {
  return (
    <ThemeProvider>
      <Button type="solid">Hello</Button>
      <Button type="filled">Hello</Button>
    </ThemeProvider>
  );
}

重要: 需要在应用根组件使用 ThemeProvider 包裹，以应用组件库的主题配置

开发

# 安装依赖
pnpm install

# 启动开发服务器
pnpm dev

# 访问 http://localhost:8000 查看文档和示例

代码质量检查

# ESLint 检查
pnpm lint

# 自动修复 ESLint 问题
pnpm lint:fix

# Prettier 格式化
pnpm format

# TypeScript 类型检查
pnpm type-check

详细的开发规范请查看 DEVELOPMENT.md

构建

# 构建组件库
pnpm build

# 构建文档站点
pnpm build:docs

发布

# 自动更新版本号并发布到 npm
pnpm release

注意: 使用 pnpm 作为包管理器（已配置 packageManager: [email protected]）