Docs 是 fighting design 官方文档目录，使用 VitePress 进行开发。
vitePress 是一个 Vite 和 Vue 支持的静态站点生成器，使用 MarkDown 进行编写。如果你还不了解 MarkDown，可以通过这里进行学习。
如果你也想编写自己的 blog，可以在 VitePress 官方进行学习使用。vitepress-template 是我已经配置好的一个项目，也可以拿来开箱即用。
- 官方文档：Fighting Design
- 仓库地址：Docs
首先需要在 docs/components 目录下，新建一个以组件小写名，去掉首字母 F 的 *.md 文件。如：button，而不是 FButton。
*.md内，只允许出现一个一级标题#，后面全部使用二级标题##，禁止出现二级标题以下的标题- 一级标题为
组件的名称 + 中文描述，中间要带有空格。如：Button 按钮、Icon 图标。这里的组件名要以大写开头 - 接下来每个二级标题用于描述配置信息，配置信息下面要写入简单的描述。如下，取自 button.md：
## 基本使用
`type` 属性可以配置不同的按钮类型，展示不同的颜色状态
- 并不是组件的所有配置项都要带有演示用例，突出主要即可
- 英文名要用反引号包裹，左右两边要带有空格。如：
type配置按钮的类型 - 描述信息之后要带有具体的配置例子
- 需要提供演效果的代码段，代码段使用已经封装好的
::: demo语法来展示 demo 和下拉菜单内容，详情配置可参考 plugins.ts 。例：
::: demo
<template #source>
<!-- source 插槽插入示例 -->
</template>
<!-- 默认插槽插入代码片段 -->
:::
- 在组件演示完之后，要写详细的
Attributes（必须）、Slots（可选）、Events（可选）描述信息。使用table进行编写，格式规范参考如下：
Attributes
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|---|---|---|---|---|
xxx |
xxx | xxx | xxx |
xxx |
Slots
| 名称 | 说明 |
|---|---|
xxx |
xxx |
Events
| 事件名称 | 说明 | 回调参数 |
|---|---|---|
xxx |
xxx | xxx |
- 在上面表格中的
Attributes 的参数列、Attributes 的可选值列、Slots 的名称列、Events 的事件名称列的内容需要使用反引号包裹，每一项都应该使用 kebab-case 形式 - 表格中需要详细的描述好每个选项
- 在
*.md内部可以直接写入vue组件代码，完全可以正常解析 - 在
*.md内部可以直接定义和本页面相关的样式，或者TypeScript语法，完全可以像下面这样使用：
# xxx
## xxx
code....
<script setup lang="ts">
TypeScript code...
</script>
<style scoped>
css code...
<style>
在你新建的组件文档文件之后，你需要在 sidebar 中引入你的文档，才可以正常显示
在项目根目录执行命令：
pnpm dev:docs来启动测试文档
文档在 Attributes 或者 Slots 的结尾需要加入 Contributors（贡献者） 如果你参与了某个组件的开发或者维护，那么就可以将你放在该组件下发的开发者列表中！
格式如下:
a 标签的 href 属性用作你的 Github 首页地址，FAvatar 组件的头像地址用作你的 Github 头像地址。可在 Github 首页右键头像，复制头像地址填入。
<a href="" target="_blank">
<f-avatar round src="" />
</a>例如我的：
<a href="https://github.com/Tyh2001" target="_blank">
<f-avatar round src="https://avatars.githubusercontent.com/u/73180970?v=4" />
</a>规范可能随时会增加或者修改，在编写文档前请认真阅读规范指南。