cui-design-ui

一个使用 React + TypeScript 构建的组件库，打包由 tsup 驱动并配合 Tailwind CSS 生成样式，可在应用和文档站点中复用。

特性

• ⚛️ 使用函数式组件与 Hooks，完备的 TypeScript 类型提示
• 📦 ESM + CJS 双格式输出，默认导出类型声明与构建后的 CSS
• 🎯 组件按需导出，可与 Tree Shaking 协同工作
• 🧩 包含按钮、表单、弹窗、图表、甘特图等常用组件

安装

npm install cui-design-ui
# 或
yarn add cui-design-ui
# 或
pnpm add cui-design-ui

快速上手

import 'cui-design-ui/dist/index.css' // 引入默认样式
import { Button } from 'cui-design-ui'

export default function App() {
  return <Button variant="primary">Hello</Button>
}

• 如果你已经在项目中引入了 Tailwind，可以根据需求覆盖或替换默认样式。
• 更多示例与组件文档请访问文档站：https://duwenlong1995.github.io/react-ui

常用脚本

npm run dev          # 使用 tsup 监听打包
npm run docs:dev     # 启动 dumi 文档（会同步构建 CSS）
npm run build        # 产出 dist 目录（包含 cjs / mjs / d.ts / css）
npm run docs:build   # 生成静态化文档
npm run lint         # ESLint 质量检查
npm run typecheck    # TypeScript 类型检查

发布到 npm

1. 确认版本号：npm version patch|minor|major
2. 生成产物：npm run build
3. 可选检查：npm publish --dry-run
4. 发布：npm publish --access public

开源协议

MIT © duwenlong1995

npm login
npm publish --dry-run
npm publish --access public
用 npm info cui-design-ui 或访问 npm 页面确认新版本上线。