Token导航 LogoToken导航

Agent Skill · 效率

frontend-tech-doc-guide(前端技术文档指南)

用于辅助前端页面、组件、样式和交互逻辑的开发与维护。它适合让 Agent 生成或审查 React、Next.js、Vue、Tailwind、CSS 等相关代码,整理组件结构,或定位布局和性能问题。使用时需要结合项目现有设计系统、路由和构建方式,避免只生成孤立片段;涉及页面改动时,应配合本地预览和构建检查确认视觉效果。

frontend-tech-doc-guide 是效率类 Agent Skill,可用宿主为 OpenClaw,通过ClawHub获取,权限为只读;许可证为 MIT-0,第三方扫描已通过,按安装量在效率类的 21,003 个 Skill 里排第 15,151。

总安装 3,189周安装 137GitHub Stars 公开资料未说明下载 1,118核验 2026-05-01

安装说明

本站只整理中文说明,不托管安装包,也不代用户安装。
GitHub
许可证
MIT-0
版本
1.0.0

安装方式

通过对话安装

复制提示词发给支持本地命令或 Skills 的 AI 助手,先确认命令和权限,再让它执行。

请帮我安装这个 Agent Skill:frontend-tech-doc-guide(前端技术文档指南)
来源仓库:https://github.com/kelaner/frontend-tech-doc-guide
安装命令:
openclaw skills install frontend-tech-doc-guide
安装前请先检查当前环境是否支持对应 CLI,并向我确认将要执行的命令、安装目录、联网范围和文件读写权限;确认后再执行。

命令行安装

复制命令到本机终端执行。该命令会通过 OpenClaw 从第三方来源获取 Skill;本站只展示命令,不托管安装包,也不自动执行。

ClawHubOpenClaw
openclaw skills install frontend-tech-doc-guide

这个 Skill 是做什么的

效率类 Skill 把重复的整理、汇总、转换工作交给助手完成,减少手工复制粘贴。

规范 AI 生成飞书技术文档结构,确保 Markdown 层级正确、章节顺序稳定、可读性高。

上手步骤

4 步
  1. 1

    确认自己的宿主工具

    公开资料标注支持 OpenClaw;先确认自己用的是其中之一,再按对应工具的 Skills 目录放置。

  2. 2

    拿到安装命令

    可以直接复制的命令是 openclaw skills install frontend-tech-doc-guide;命令里的占位符换成自己的路径或密钥再执行。

  3. 3

    安装后重启宿主

    命令执行完要完全退出宿主工具再打开,让新装的 Skill 被重新扫描到,否则列表里可能看不到。

  4. 4

    按最小权限试用

    它标注为只读,先用只读任务试一次,确认行为符合预期再扩大使用范围。

常见问题

6 条

frontend-tech-doc-guide 怎么安装?

在终端执行 openclaw skills install frontend-tech-doc-guide。装完完全退出宿主工具再打开,让它重新扫描本地 Skill。

frontend-tech-doc-guide 支持哪些 AI 工具?

公开资料标注支持 OpenClaw。其他工具只要能读取本地 Skill 目录,一般也能手动放进去,但要自己确认触发方式是否一致。

frontend-tech-doc-guide 需要什么权限?

权限级别是只读。该 Skill 主要提供规则、说明或参考内容,本身偏只读;真正读写文件、联网或执行命令仍取决于宿主 Agent 的任务。

frontend-tech-doc-guide 是免费的吗?

来源标注的许可证是 MIT-0。本站不代收任何费用,也不托管安装包;能否商用、要不要署名,以许可证原文为准。

frontend-tech-doc-guide 用的人多吗?

公开数据是累计安装 3,189 次,近一周安装 137 次,下载 1,118 次。这些数字来自第三方目录统计,只能当作热度参考,不代表质量或安全性。

frontend-tech-doc-guide 安全吗?

第三方扫描结果为通过,但这只覆盖已知的静态检查项,不能替代自己读一遍源码和安装命令。

值得选的地方和要先想清楚的地方

值得选的地方

  • 专注 OpenClaw 一种宿主,触发方式和使用习惯不用来回切换。
  • 许可证明确为 MIT-0,商用和分发边界好判断。
  • 第三方扫描已通过,常见的高风险行为没有命中。
  • 标注为只读权限,试用阶段不容易误改本地文件。

先想清楚的地方

  • 第三方目录整理,版本更新和行为细节以来源仓库为准。

适不适合你

更适合

  • 已经在用 OpenClaw,想直接扩展它能力的人。
  • 需要处理效率类任务、又不想每次都手写提示词的人。
  • 需要许可证清楚、并且有第三方扫描结果的团队项目。

不太适合

  • 需要厂商级技术支持和 SLA 的生产系统。

效率类 Skill 对比

6 个同类
Skill总安装GitHub 星权限许可证扫描
github

GitHub 代码协作 · OpenClaw

7,632,918545需要联网MIT-0通过
nano-pdf

Nano PDF 文档 · OpenClaw

4,249,476231需要联网MIT-0通过
auto-updater

自动更新程序 · OpenClaw

2,964,063386操作浏览器MIT-0通过
video-frames

视频帧 · OpenClaw

2,621,304112需要联网MIT-0通过
gemini

Gemini 助手 · OpenClaw

2,547,39648需要联网MIT-0有提醒
frontend-tech-doc-guide

前端技术文档指南 · 本页

3,189—只读MIT-0通过

按安装量取同分类前几名;数字来自第三方目录统计,只作热度参考,不代表质量结论。

SKILL.md 原文

name
frontend-tech-doc-guide
description
规范 AI 生成飞书技术文档结构,确保 Markdown 层级正确、章节顺序稳定、可读性高。
metadata
{"openclaw":{"emoji":"📚","auto":true}}

一、文档结构规则(必须严格遵守)

1. 标题层级规则

文档标题层级 必须严格按以下结构生成,不允许跳级:

# 文档标题

# 一、需求认知
需求 PRD:xx
飞书项目:xx
后端文档:xx
UI 设计稿:xx

- 需求背景
- 需求目标
- 核心/特殊改动点

# 二、项目排期
<!-- 评估需求开发内容量,根据复杂度和时间成本,合理分配项目排期。 -->

# 三、功能流程
<!-- 全部使用 mermaid 流程图 表示 -->
## 1. 页面流程
## 2. 功能流程
## ...其他流程

# 四、需求拆分
<!-- 详细描述需求功能模块,包括前端需求点以及所对应的后端接口。 -->
<!-- 需要考虑到边界情况以及异常处理。 -->

# 五、业务埋点 & Sentry 监控
<!-- 埋点信息从需求 PRD 中获得,关注参数,触发时机 -->
<!-- 埋点需要生成 mermaid 操作路径 -->
<!-- 特殊报错需要使用 Sentry 监控输出 -->

# 六、数据链路
<!-- 使用 mermaid 绘制用户在页面的活动链路 -->


# 七、提测信息
<!-- 使用表格格式,表头:模块、内容、备注 -->
<!-- 第一列:提测项目,提测环境 -->

# 八、验收与上线
<!-- 使用表格格式,表头:项目,上线 TAG -->


# 九、待确认问题
<!-- 使用表格格式,表头:问题,结论 -->

二、章节生成顺序(防止内容错位)

AI 必须严格按以下顺序生成内容:

  1. 需求认知
  2. 项目排期
  3. 功能流程
  4. 需求拆分
  5. 业务埋点 & Sentry 监控
  6. 数据链路
  7. 提测信息
  8. 验收上线
  9. 待确认问题

关键约束

生成时必须遵守:

  • 不得提前生成后续章节内容
  • 不得回写前文
  • 不得复制后文内容到前文

例如禁止出现:

开头出现:
第7章内容
第8章内容

若模型生成时出现重复章节,必须:

  • 删除重复段
  • 保留第一次出现的位置

三、段落排版规则(提升可读性)

AI 生成内容时 禁止连续长文本块。

每段说明 必须拆分为以下结构之一:

1 优先使用列表

错误示例:

系统需要完成登录、鉴权、资格校验、任务获取、抽奖逻辑等功能。

正确示例:

系统主要流程包括:

- 登录
- 身份鉴权
- 资格校验
- 任务获取
- 抽奖执行

2 技术描述必须结构化

统一使用 模块结构:

模块名称

- 功能说明
- 接口
- 关键逻辑
- 依赖

示例:

### 积分活动模块

功能:

- 展示用户积分
- 提供抽奖入口

接口:

- getUserPoints
- drawLottery

关键逻辑:

- 未登录先触发登录
- 积分不足提示

四、流程章节规范(必须包含 Mermaid)

流程章节 必须包含 Mermaid 图。

示例:

flowchart TD
  Entry[活动入口] --> Login{是否登录}
  Login -- 否 --> Auth[手机号授权]
  Login -- 是 --> Check[资格校验]
  Check --> Task[任务列表]
  Task --> Draw[抽奖]
  Draw --> Result[结果弹窗]

生成规则:

  • Mermaid 只允许出现一次代码块
  • 使用 <br/> 换行
  • 不允许使用 `\

`


五、模块拆分规则

模块章节必须按以下格式生成:

## 模块名称

功能:

- xxx
- xxx

核心逻辑:

- xxx
- xxx

接口:

| 接口 | 说明 |
|----|----|
| getTask | 获取任务 |
| drawLottery | 抽奖 |

依赖:

- 风控接口
- 奖品接口

禁止生成 长段技术说明文字。


六、埋点章节格式

必须使用表格。

示例:

事件code触发时机参数
页面曝光page_view页面加载...
抽奖点击draw_click点击抽奖...
抽奖成功draw_success返回中奖中奖结果

七、提测信息格式

表格结构

八、AI 生成质量规则(重点)

AI 在生成文档前必须执行:

1 章节检查

确认存在以下章节:

  • 需求认知
  • 项目排期
  • 功能流程
  • 需求拆分
  • 业务埋点 & Sentry 监控
  • 数据链路
  • 提测信息
  • 验收上线
  • 待确认问题

缺一不可。


2 排版检查

确保:

  • 无连续超过 5 行纯文本段落
  • 必须包含

* 列表 * 表格 * Mermaid


九、AI 输出限制

AI 输出文档时必须遵守:

1 不输出解释

只输出 Markdown 文档

2 不输出多版本

只输出最终版本

3 不输出空章节

无内容时写:

待补充

十、推荐文档标题格式

【YYMMDD】活动简称-前端技术方案

示例:

【260320】春季直播活动-前端技术方案

十一、生成目标

AI 生成的文档必须达到:

  • Markdown 层级正确
  • 飞书渲染结构稳定
  • 章节顺序正确
  • 信息结构化
  • 可读性高

否则视为生成失败。

平台分布

OpenClaw

94.19%
按下载量换算1,053

安全审计

VirusTotal

通过

ClawScan

通过

Static analysis

通过

权限和风险

只读

该 Skill 主要提供规则、说明或参考内容,本身偏只读;真正读写文件、联网或执行命令仍取决于宿主 Agent 的任务。

安装前确认

本站仅展示第三方公开信息,不托管安装包,不提供自动安装或运行环境。安装前应自行审查源码、依赖和命令行为。目前只有一个公开来源,建议同时核对源仓库。

继续浏览同类 Skills