xl-story-book v1.0.24

项目介绍

基于 storybook 实现的设计系统
包含了基础组件、业务组件、组件模版等

技术栈

命令

• 安装

npm install -g pnpm
pnpm install

• 启动

pnpm run storybook

• 构建

# 构建用于发布的 storybook 生产文件
pnpm run build:storybook

# 构建用于发布的 NPM 包
pnpm run build

• 其他

# 执行单元测试和单元测试更新
pnpm run test
pnpm run test:update

# 运行 eslint, stylelint, tsc
pnpm run lint
pnpm run lint:fix

目录结构

.
├── .storybook                # storybook 配置目录
├── components                # 组件源码目录
│   ├── component             # 组件目录(例如：button)
│   │   ├── __tests__                   # 单元测试文件目录
│   │   ├── stories                     # stories 文档目录
│   │   │   ├── index.stories.tsx       # 主文件
│   │   │   ├── mock.tsx                # mock 文件
│   │   ├── index.ts          # 组件代码
│   │   ├── hooks             # 组件内部组件
│   │   ├── propsType.ts      # 组件类型定义
│   │   ├── styled.ts         # 组件样式
│   ├── stories               # stories 通用工具目录
│   ├── style                 # 通用样式目录
│   ├── utils                 # 通用工具目录
│   ├── index.ts              # 组件集合目录
│── docs                      # 项目文档目录
│── scripts                   # 项目构建脚本目录
│── stories                   # 项目 stories 文档目录
│── tests                     # 测试配置脚本目录
│── typings                   # 全局类型定义
│── babel.config.js
│── commitlint.config.js
│── jest.config.js
│── .lintstagedrc.json
│── .prettierrc
└── .eslintrc.json
└── tsconfig.json

分支管理

发布流程

开发规范

• 组件开发
• 单元测试
• 文档编写