Skip to content

Markdown 编写规范

编写组件 README.md 时,请遵循以下规范,以确保文档渲染和导航功能正常。

标题规范

不要以数字开头

标题不能以数字开头,否则会导致左侧目录菜单无法正常滚动定位。

markdown
<!-- ❌ 错误:标题以数字开头 -->
## 1. 安装依赖
## 2. 基本用法
## 2024年更新日志

<!-- ✅ 正确:文字在前 -->
## 第一步:安装依赖
## 第二步:基本用法
## 更新日志(2024)

原因:平台使用 CSS 选择器定位标题实现滚动锚点。CSS 选择器不能以数字开头,如 #1.-安装依赖 是无效的选择器,点击目录项菜单会高亮但页面无法滚动。

层级规范

  • 一级标题(#:文档标题,整个文档只有一个
  • 二级标题(##:主要章节,建议 3~8 个
  • 三级标题(###:子章节,根据需要添加
  • 四级标题(####:细节说明,谨慎使用
markdown
# 组件名称

## 安装

## 基本用法

### Props 属性

### Events 事件

## 示例

### 基础示例

### 高级用法

其他注意事项

避免特殊字符

标题中避免使用特殊字符(如 <>{}[]| 等),以免影响锚点生成:

markdown
<!-- ❌ 避免 -->
## Props {#custom-id}

## <MyComponent> 使用方式

<!-- ✅ 推荐 -->
## Props

## MyComponent 使用方式

不要使用纯数字标题

markdown
<!-- ❌ 避免 -->
## 2023
## 2024

<!-- ✅ 推荐 -->
## 2023年更新
## 2024年更新

HTML 标签不要出现在标题中

markdown
<!-- ❌ 避免 -->
## <code>hello()</code> 方法

<!-- ✅ 推荐 -->
## hello() 方法

<!-- 或使用反引号 -->
## `hello()` 方法

内容规范

文档结构

推荐组件 README 包含以下章节:

  1. 组件简介## 简介):一句话描述组件功能
  2. 安装方式## 安装):说明依赖和引入方法
  3. 基本用法## 基本用法):最小可运行示例
  4. API 文档:Props、Events、Slots 说明(可用表格)
  5. 示例:典型使用场景

代码块

代码块应明确指定语言,以获得正确的语法高亮:

markdown
```vue
<template>
  <Button>点击</Button>
</template>
js
import { ref } from 'vue'

### 表格

推荐使用表格展示 Props / Events:

```markdown
| 属性 | 类型 | 默认值 | 说明 |
|------|------|--------|------|
| `size` | `'small' \| 'medium' \| 'large'` | `'medium'` | 按钮尺寸 |
| `disabled` | `boolean` | `false` | 是否禁用 |

链接

  • 内部跳转使用 Markdown 锚点:[安装](#安装)
  • 外部链接使用完整 URL:[Vue 文档](https://cn.vuejs.org)

快速自查清单

发布组件前,请检查 README:

  • [ ] 标题不以数字或特殊字符开头
  • [ ] 标题层级合理(## 为主,### 为辅)
  • [ ] 代码块指定了语言类型
  • [ ] 包含基本用法示例
  • [ ] Props / Events 说明清晰

用户上传的组件遵循开源协议