html-guidelisted

# HTML Guide Maker 把任意内容变成一份**单文件、可离线打开、美观、可交互**的 HTML 指导文档。 **核心流程**：`接收内容 → 判定文档类型 → 联网核实补充 → 按设计体系撰写 HTML → 自检 → 交付` > [!IMPORTANT] > ## 三条不可违背的硬规则 > 1. **单文件自包含**：最终产物必须是一个 `.html` 文件，CSS/JS/图标全部内联， > 不得引用任何外部 CDN、字体、图片、样式表。双击即可离线打开。这是用户的核心诉求。 > 2. **联网核实**：涉及事实、数据、命令、版本、配置、概念定义时，必须先联网搜索核实， > 不得凭记忆直接写死。核实的来源要收集起来放进页面的「参考来源」区。 > 3. **先判断再写**：动手前先判定内容属于哪种文档类型（见 structure-guide.md）， > 选择匹配的页面结构与组件，而不是套用固定模板。类型决定结构。 ## 工作流程 ### Step 1：接收与归一化内容 🚧 **GATE**：拿到用户给的内容。任何形式都可以： | 用户给的内容 | 处理方式 | |---|---| | 对话中的回答 / 讲解 / 想法（当前上下文） | 直接采用，视为正文素材 | | 粘贴的文字 / Markdown / 笔记 | 直接采用 | | 本地文件（.md/.txt/.html/代码文件） | `Read` 读取 | | 网页 URL | 用 `WebFetch`（或 curl 走代理）抓取正文，标注来源 | | 只有一个主题 / 标题 | 视为「内容空缺」，正文主要由 Step 3 搜索补齐 | 先在心里（或草稿）梳理一遍：这份内容的**核心目标读者**是谁、要教会/说明**什么**、 有没有明显缺失的环节。缺的信息记下来，交给 Step 3。 **✅ 检查点：内容已归一化为可用正文，可判定文档类型。** ### Step 2：判定文档类型（自适应结构） 🚧 **GATE**：Step 1 完成。 按 signals 判定内容属于哪种 archetype，然后选择匹配的结构。**判定信号与每种类型的 推荐章节结构、组件清单都在 `references/structure-guide.md`**。判定规则： - 内容包含**步骤/流程/命令序列** → `procedure`（操作教程） - 内容在**解释一个概念/机制/原理** → `explainer`（知识讲解） - 内容在**帮读者做选择/比较方案** → `decision`（决策指南） - 内容是**知识点汇总/速查** → `reference`（参考手册） - 内容包含**大量代码/配置文件** → `code-guide`（代码指南，可与其他类型叠加） - 混合内容 → 识别主体类型，再叠加次要类型的局部组件（如讲解中嵌一段操作步骤） **先读 `references/structure-guide.md` 对应章节再动手**，不要凭感觉编结构。 **✅ 检查点：文档类型已判定，页面骨架（章节顺序）已确定。** ### Step 2.5：确认输出内容（多选，先问这个） 确定完内容后，**先问用户要哪些输出**（AskUserQuestion，`multiSelect: true`，可多选）： - **HTML**（默认，几乎总选）——单文件指导文档本体 - **长图** —— 整页内容滚成一张长图（纵向长截图，适合看