# 🌟 Dumi Template

基于 Umi、为组件开发场景而生的文档模板

[English](./README.md) | 简体中文

## 🚀 如何使用？

![](./use.png)

## ✨ 在线预览

https://umijs.github.io/dumi-template/

## 📒 目录介绍

```
├── docs                   文档存放路径
│   ├── index.md           首页展示
│   └── **.**              网站目录文档
├── src                    组件主目录
│   ├── index.ts           组件注册
│   └── Foo                组件开发
├── .eslintrc.js           eslint 配置
├── .fatherrc.ts           father 配置
├── .umirc.ts              dumi 配置
└── tsconfig.json          typescript 配置
```

其余文件可自行查阅了解。

## 🤖 命令介绍

| 名称                    | 描述           | 备注                                                                 |
| ----------------------- | -------------- | -------------------------------------------------------------------- |
| `npm run start`         | 项目启动       | 使用 [dumi](https://github.com/umijs/dumi)，组件开发和文档开发在一起 |
| `npm run test`          | 组件测试       | -                                                                    |
| `npm run test:coverage` | 代码覆盖率查看 | -                                                                    |
| `npm run prettier`      | 代码美化       | -                                                                    |
| `npm run build`         | 组件打包       | 使用 [father](https://github.com/umijs/father) 工具                  |
| `npm run release`       | 组件打包发布   | -                                                                    |
| `npm run docs:build`    | 文档打包       | -                                                                    |
| `npm run docs:deploy`   | 文档发布       | 这里默认是使用了 GitHub Pages                                        |
| `npm run deploy`        | 文档打包发布   | -                                                                    |

## 💖 谁在使用？

<table>
  <tbody>
    <tr>
      <td align="center">
        <a target="_blank" href="https://umijs.org">
          <img
            width="32"
            src="https://gw.alipayobjects.com/zos/bmw-prod/598d14af-4f1c-497d-b579-5ac42cd4dd1f/k7bjua9c_w132_h130.png"
          />
          <br>
          <strong>UmiJS</strong>
        </a>
      </td>
      <td align="center">
        <a target="_blank" href="https://ahooks.js.org/">
          <img
            height="32"
            style="vertical-align: -0.32em; margin-right: 8px;"
            src="https://ahooks.js.org/logo.svg"
          />
          <br>
          <strong>ahooks</strong>
        </a>
      </td>
      <td align="center">
        <a target="_blank" href="https://procomponents.ant.design/">
          <img
            width="32"
            style="vertical-align: -0.32em; margin-right: 8px;"
            src="https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg"
          />
          <br>
          <strong>Pro Components</strong>
        </a>
      </td>
      <td align="center">
        <a target="_blank" href="https://github.com/react-component">
          <img
            width="32"
            style="vertical-align: -0.32em; margin-right: 8px;"
            src="https://avatars3.githubusercontent.com/u/9441414?s=200&v=4"
          />
          <br>
          <strong>react-component</strong>
        </a>
      </td>
      <td align="center">
        <a target="_blank" href="https://ggeditor.com">
          <img
            width="32"
            style="vertical-align: -0.32em; margin-right: 8px;"
            src="https://img.alicdn.com/tfs/TB1FFA1CFP7gK0jSZFjXXc5aXXa-214-200.png"
          />
          <br>
          <strong>GGEditor</strong>
        </a>
      </td>
    </tr>
    <tr>
      <td align="center">
        <a target="_blank" href="https://remaxjs.org">
          <img
            width="32"
            style="vertical-align: -0.32em; margin-right: 8px;"
            src="https://gw.alipayobjects.com/mdn/rms_b5fcc5/afts/img/A*1NHAQYduQiQAAAAAAAAAAABkARQnAQ"
          />
          <br>
          <strong>Remax</strong>
        </a>
      </td>
      <td align="center">
        <a target="_blank" href="https://lightproxy.org">
          <img
            width="32"
            style="vertical-align: -0.32em; margin-right: 8px;"
            src="https://user-images.githubusercontent.com/5436704/81533849-83e00f00-9399-11ea-943d-ac5fd4653906.png"
          />
          <br>
          <strong>LightProxy</strong>
        </a>
      </td>
      <td align="center">
        <a target="_blank" href="https://juejin-im.github.io/open-source/">
          <img
            width="32"
            style="vertical-align: -0.32em; margin-right: 8px;"
            src="https://avatars3.githubusercontent.com/u/69633008?s=200&v=4"
          />
          <br>
          <strong>juejin-im</strong>
        </a>
      </td>
    </tr>
  </tbody>
</table>

### README 徽章

快来领取徽章展示吧：[![dumi](https://img.shields.io/badge/docs%20by-dumi-blue)](https://github.com/umijs/dumi)

```
[![dumi](https://img.shields.io/badge/docs%20by-dumi-blue)](https://github.com/umijs/dumi)
```

## 交流群

<div>
  <img src="https://gw.alipayobjects.com/zos/bmw-prod/881c4596-a6cc-4f69-be8d-f94c4e02e058/k7ttshpq_w1004_h1346.jpeg" width="300" />
  <img src="https://gw.alipayobjects.com/zos/bmw-prod/c18bc2a5-719a-48ca-b225-c79ef88bfb43/k7m10ymd_w1004_h1346.jpeg" width="300" />
</div>