1实现原理 · 为什么它能做到
该 skill 是 html-anything 的「模板包」：frontmatter 供选择器取元数据，SKILL.md 正文（frontmatter 之后的 body）被 loader 原样读出后作为模型指令。
next/src/lib/templates/loader.ts
const { fm, body } = parseFrontmatter(raw);
注：本模板正文 13 行 / 651 字节（本批最薄之一）；frontmatter 走 parseFrontmatter 拆成 fm/body 两份，目录内没有任何脚本参与。
真正送进模型的 prompt = 共享设计指令 + 本模板正文 + 【输入格式】+【用户内容】；共享指令还带一条覆盖规则，声明模板里的页数/版面数字不是上限。
next/src/lib/templates/shared.ts
return `${SHARED_DESIGN_DIRECTIVES} ${opts.body.trim()}
注：同文件里紧随的覆盖规则逐字写着：模板只定义"可用版面 / 风格 / 配色 / 字体 / 组件库", **不定义** slide / 帧 / 卡片 / section 的数量。
产出纪律由共享指令硬性约束：禁止 agent 使用任何文件系统工具，HTML 必须以 stdout 文本流式输出、由前端落盘。
next/src/lib/templates/shared.ts
- **禁止使用 Write / Edit / MultiEdit / Bash / Create / 任何文件系统工具**。不要把 HTML 写到任何
注：本模板自身不声明落盘方式，完全依赖这条共享约束。
横向翻页用 CSS scroll-snap 实现：example.html 的 body 用 scroll-snap-type: x mandatory，不依赖任何第三方库。
next/src/lib/templates/skills/deck-simple/example.html
scroll-snap-type: x mandatory;
注：同文件另有 .slide { flex: 0 0 100vw; … scroll-snap-align: start; } 一族样式，滑动手感纯 CSS 给出。
页数自决：cover + N 内容页 + 收尾，短内容 6-10 起、长内容更多，每页仅一个核心信息 + 一张图/图表。
next/src/lib/templates/skills/deck-simple/SKILL.md
- 每页一个核心信息 + 1 张图 / 1 个图表
注：同段的「- 顶部 progress bar」提供了整体进度感，替代花哨的导航控件。
键盘导航与 hash 同步由正文规定：← / → 切换 + hash 同步，便于分享具体页。
next/src/lib/templates/skills/deck-simple/SKILL.md
- 键盘 ← / → 切换 + hash 同步
注：与 deck-open-slide-canvas 的同类要求一致，说明这是全仓 deck 家族的共同约定。
页容器符合全仓 deck 约定：example.html 的 6 个 section 均带 class 含 slide（用 data-od-id 而非 data-slide-id）。
next/src/lib/deck.ts
const dataId = extractAttr(openTag, "data-slide-id");
注：deck.ts 取不到 data-slide-id 时回退为 1-based 序号，因此该样例仍可被逐页解析与导出。
2核心能力
01通用 horizontal-swipe 结构：cover + N 内容页 + 收尾，N 由内容长度决定
02每页一个核心信息 + 1 张图/图表（强制信息密度上限）
03顶部 progress bar 提供进度感
04键盘 ← / → 切换 + hash 同步（可分享到具体页）
05产物样例为纯 CSS scroll-snap 横向翻页，零远程资源
06明确的否定式约束：不要 magazine 调（避免编辑设计抢戏）
07CLI 关键词路由：simple / deck / 简单 / 简洁 / 简约 → deck-simple
3外部依赖
| 类型 | 依赖 |
|---|---|
| cli | 宿主本机 agent CLI（应用侧 spawn；非本 skill 指令） |
| package | 无第三方包/字体依赖（产物样例自包含） |
4风险提醒 风险提醒：绿色 · 放心使用
风险提醒：绿色 · 放心使用
- 描述极简，风格上限依赖共享设计指令 — 正文 651 字节，模板本身不定义色板/字号；想要强烈风格需换更具体的模板。
- 「不要 magazine 调」是软约束 — 没有程序化校验，弱模型仍可能生成杂志式大图排版。
- 预览 iframe 的 sandbox 组合偏宽（宿主侧） — template-picker.tsx:544 / preview-pane.tsx:297 = sandbox="allow-scripts allow-same-origin"；本模板样例含内联脚本，会在此环境下执行。
- 用户内容逐字进 prompt（注入面） — assemblePrompt 原样拼接【用户内容】区块。
风险提醒：绿色，放心使用。判级对象＝skill 目录（SKILL.md + example.html）：无可执行脚本文件、无凭证读取、无写盘指令、且目录内零外部端点（example.html 无 URL/无远程 script/无 @import，字体走系统栈）；SKILL.md 正文零 URL、零 CDN 要求。唯一需在 risks 里知会的是 example.html 含内联 <script>（翻页与进度条逻辑）——那是预览产物里的静态代码，不是 skill 指令，也不改档位。本仓 html-anything 模板按批4口径统一 🟢 绿档：判级对象＝skill 自身目录；宿主壳（loader.ts/assemblePrompt/本地 agent CLI/预览 iframe）与 example.html 里的字体、CDN 引用属产物期行为（由浏览器拉取、skill 执行时不外发），只写进 reason/risks，不判档。
5第二遍独立确认
- [ok] 文件清单（2 个文件，无脚本文件） — SKILL.md(651B) + example.html(7489B)；无 .sh/.py/.js/.ts。
- [ok] 正文零端点复核 — SKILL.md 内 http/CDN/fetch/script 零命中。
- [ok] 目录内端点自证（零命中） — example.html 全文件无 http(s)://、无 @import、无远程 <script>；仅有内联 <script> 与系统字体栈。
- [ok] 无凭证读取 — key/secret/token/.env 零命中。
- [ok] 无写盘指令 — SKILL.md 无 write/save 类指令；shared.ts 明令禁文件工具。
- [ok] 产物的横向翻页为纯 CSS — example.html「scroll-snap-type: x mandatory;」与 .slide 的 scroll-snap-align 定义，无需第三方库。
- [ok] official_desc 逐字命中 — 与第 6 行 description 引号内文本一致。
- [ok] CLI 路由行存在 — cli/src/skills-matcher.ts 第 62 行 simple 行逐字命中。
6结论
适合：适合要「先出个干净 deck」的通用场景：pitch、overview、study notes、内部汇报——不挑题材、零外部依赖、可直接离线打开与导出。也适合作为其它 deck 模板的对照基线。
不适合：不适合需要强烈视觉识别度的场合（无预设色板/字体）；不适合杂志式长文阅读（天然反 magazine）；不适合需要讲者备注的演示（无 aside.notes 机制）。
安装 agent 直装可复制
① 本站镜像 更新 2026-09-15
方式 A · 人下载镜像包下载 deck-simple.tar.gz
sha256:
方式 B · JSON 格式安装指南，复制给 agenteb7207bfa03a44b8…agent 读 JSON 指南后会自动从本站下载安装，无需更多说明。
② 上游 GitHub · 原始来源
来源信息 GitHub 原始
作者 / 仓库nexu-io / nexu-io/html-anything
原始 GitHubnexu-io/html-anything ↗
Stars8827
最近推送2026-09-15
本 skill commit
553ed98c28许可Apache-2.0（工作副本根目录 LICENSE 文件 = Apache License Version 2.0；GitHub API spdx_id=Apache-2.0。注意：skill 目录本身不含独立 LICENSE，许可来自仓库根；第三方来源模板在 README 另有署名说明）
本站信息
收录日期2026-09-06
分类设计
侦查报告AI 侦查 · 2 遍 · 2026-09-06
本站镜像与 GitHub 原始是不同来源：本站锁定 commit 快照经 /r2 分发；GitHub 为实时上游，内容可能已更新。