huohua-fe v1.0.1

huohua-we-fe-pc

一个基于 Antd-v3 所封装的业务组件库

Features

• 支持 TypeScript
• 支持 less
• 支持 eslint & prettier
• 支持按需加载
• 基于 umijs/father 完成打包，可使用 cjs、esm 和 umd 三种格式的引用
• 支持 mdx 文档

Installation

$ yarn 

Usage

# 开发组件
$ npm run start

# 开发文档
$ npm run dev

# 文档构建
$ npm run doc:build

# 打包
$ npm run lib:build

目录结构

── README.md
├── lib
├── dist
├── es
├── package.json
├── public // 公共文件
├── scripts // 构建用到的脚本
├── src
|  ├── App.less
|  ├── App.tsx
|  ├── index.css
|  ├── index.tsx
|  ├── Components  // 写组件的地方
|  |  |  ├── EmptyLine
|  |  |  |  └── index.tsx 组件入口
|  |  |  |  └── style.less // 样式
|  |  |  |  └── style.mdx 文档
|  |  ├── ...
└── tsconfig.json
└── .fatherrc.js

组件

开发

在 src 目录下，新增一个组件的目录，类似上面的 EmptyLine 组件。 目录名需要保持驼峰命名。 如果是自定义组件，需要取一个 antd 中所不包含的组件名称。 此时应该可以看到组件，并继续开发了。

文档

开发文档

编写组件里面的 index.mdx，并运行命令查看效果

npm run doc:start

构建文档

npm run doc:build

发布文档

npm run doc:deploy

项目中使用

引入huohua-fe

$ yarn add https://git.bg.wanduoduo.com/wangtao/huohua-we-fe-pc.git

在所需的页面中引入：例：

import { EmptyLine } from 'huohua-fe'

render() {
	return <EmptyLine />
}

其他使用方式参考开发文档