# phonics-ui

[![version](https://img.shields.io/npm/v/phonics-ui.svg)](https://www.npmjs.com/package/phonics-ui)

## 文档

<http://phonics-ui.llssite.com/>

## 简介

phonics-ui 是使用在 sprout 组前端项目的组件库，包括但不限于 react 组件、工具函数，创建该组件库基于以下原因：

- 组内有 2+ 个项目，多个项目中使用的组件基本相同，如果将组件置于各项目下，会产生很多重复工作
- 准备在未来逐渐将 js 替换为 typescript，从组件入手改造是一个不错的切入点
- 将组件单独抽出后可以针对性的做文档和单元测试，方便开发和测试
- sprout 组的项目通常需要同时支持 phone 和 pad，将这个逻辑封装到组件中可以减少重复开发的工作

## 安装

```
yarn add phonics-ui
```

## 开始使用

```js
import { Picture } from 'phonics-ui'
```

## 开始开发

```
git clone git@git.llsapp.com:sprout/frontend/phonics-ui.git
cd phonics-ui
yarn
yarn parcel demo/xxx/index.html
yarn build
```

- 项目使用 ts 开发，需要明确定义类型，尽量不要定义 any 类型
- 运行 `npm run build` 会自动生成 .d.ts 文件
- 包被发到 npmjs.com, 如需发布权限请 @guang.xing

## 参考文档

<https://www.tslang.cn/>

<https://jkchao.github.io/typescript-book-chinese/>