map-docs

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

Documentation Link Mapper

文档链接映射器(Documentation Link Mapper)

Map the navigation structure of documentation websites to understand their hierarchy before creating Claude Code skills.
在创建Claude Code技能前,映射文档网站的导航结构,以便理解其层级关系。

Purpose

用途

Extract the sidebar/navigation structure from documentation sites, producing a hierarchical tree of sections and subsections with their URLs. This enables systematic skill creation covering each documentation area.
从文档网站提取侧边栏/导航结构,生成包含各章节及子章节URL的层级树状结构。这有助于系统性地创建覆盖所有文档领域的技能。

When to Use

使用场景

  • Before creating skills for a library/framework
  • When needing to understand docs structure
  • When planning comprehensive documentation coverage
  • 为某库/框架创建技能之前
  • 需要理解文档结构时
  • 规划全面的文档内容覆盖范围时

Process

操作流程

Step 1: Fetch the Documentation Page

步骤1:获取文档页面

Use WebFetch to retrieve the documentation page and extract navigation links:
WebFetch the documentation URL with prompt:
"Extract the sidebar/navigation structure. Return a hierarchical list of all documentation sections and subsections with their URLs. Format as:

Section Name → /path
  - Subsection 1 → /path/subsection1
  - Subsection 2 → /path/subsection2

Include ALL navigation links, preserving parent-child relationships."
使用WebFetch工具获取文档页面并提取导航链接:
WebFetch the documentation URL with prompt:
"Extract the sidebar/navigation structure. Return a hierarchical list of all documentation sections and subsections with their URLs. Format as:

Section Name → /path
  - Subsection 1 → /path/subsection1
  - Subsection 2 → /path/subsection2

Include ALL navigation links, preserving parent-child relationships."

Step 2: Format the Output

步骤2:格式化输出

Present the structure as a tree showing the hierarchy:
Getting started
  - Installation → /docs/installation
  - Quick start → /docs/quickstart
API Reference
  - Methods → /docs/api/methods
  - Properties → /docs/api/properties
将结构以树状形式呈现,展示层级关系:
Getting started
  - Installation → /docs/installation
  - Quick start → /docs/quickstart
API Reference
  - Methods → /docs/api/methods
  - Properties → /docs/api/properties

Step 3: Identify Skill Groupings

步骤3:确定技能分组

Analyze the structure to suggest logical skill groupings:
  1. Core concepts - Installation, getting started, basics
  2. API sections - Methods, properties, events
  3. Advanced topics - Performance, plugins, extensions
  4. Examples/Recipes - Common patterns, tutorials
分析结构,提出合理的技能分组建议:
  1. 核心概念 - 安装、快速入门、基础内容
  2. API模块 - 方法、属性、事件
  3. 进阶主题 - 性能、插件、扩展
  4. 示例/实践方案 - 常见模式、教程

Output Format

输出格式

Provide both:
  1. Tree view - Human-readable hierarchical structure
  2. Flat list - All URLs for systematic crawling
需同时提供以下两种格式:
  1. 树状视图 - 便于人类阅读的层级结构
  2. 扁平列表 - 用于系统性爬取的所有URL列表

Tips

注意事项

  • Some sites load navigation dynamically - if WebFetch returns incomplete results, note this limitation
  • Focus on the documentation sidebar, not header/footer navigation
  • Preserve the exact URL paths for later content fetching
  • Group related sections when suggesting skill structure
  • 部分网站的导航是动态加载的——如果WebFetch返回的结果不完整,请注明这一限制
  • 重点关注文档的侧边栏导航,而非页眉/页脚导航
  • 保留准确的URL路径,以便后续获取内容
  • 在建议技能结构时,将相关章节进行分组

Example Usage

使用示例

User: "Map the animejs documentation structure"
Response:
  1. Fetch https://animejs.com/documentation
  2. Extract navigation structure
  3. Present tree view
  4. Suggest skill groupings for comprehensive coverage
用户:"映射animejs的文档结构"
响应:
  1. 获取https://animejs.com/documentation页面
  2. 提取导航结构
  3. 呈现树状视图
  4. 提出全面覆盖的技能分组建议