1实现原理 · 为什么它能做到
该 skill 是 html-anything 的「模板包」：frontmatter 供选择器取元数据，SKILL.md 正文（frontmatter 之后的 body）被 loader 原样读出后作为模型指令。
next/src/lib/templates/loader.ts
const { fm, body } = parseFrontmatter(raw);
注：本模板正文 约 15 行 / 1074 字节（意图 + 主题清单 + 页数规则）；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 写到任何
注：本模板自身不声明落盘方式，完全依赖这条共享约束。
主题机制是「8 选 1 且不混用」：helix / holm / vance / bevel / world-dark / world-mint / atlas / bluehouse，每套自带完整调色板 + 字体 + accent。
next/src/lib/templates/skills/deck-replit/SKILL.md
- Pick one theme: helix / holm / vance / bevel / world-dark / world-mint / atlas / bluehouse
注：与 deck-presenter-mode 的运行时切主题相反：这里主题在生成前选定并贯穿全程。
页数显式交给内容长度：cover + agenda + N 个 content + 收尾，短内容 6-10 起、长内容更多。
next/src/lib/templates/skills/deck-replit/SKILL.md
- Cover + agenda + N 个 content + 收尾 (N 由【用户内容】长度决定, 完整覆盖每个要点; 短内容 6-10 起步, 长内容应更多)
注：这是本批 9 个模板里把「数量自决」写得最直白的一个。
随附 example.md 是「输入样例」而非模板稿：给出主题（world-mint）、deck 标题与 5 条 agenda，示范短输入 → 双页预览的用法。
next/src/lib/templates/skills/deck-replit/example.md
## Agenda
注：同文件的「Replit Slides 八套主题之一 (helix / holm / vance / bevel / **world-mint** / atlas / bluehouse)」与正文主题清单互为印证。
来源标注齐全：frontmatter 记 example_source_url = replit.com/slides，另有 example_id/example_name/example_format 等六项。
next/src/lib/templates/skills/deck-replit/SKILL.md
example_source_url: "https://replit.com/slides"
注：该 URL 只作为出处展示，不产生请求。
2核心能力
018 套主题选 1（helix/holm/vance/bevel/world-dark/world-mint/atlas/bluehouse），禁止混用
02页数由内容长度决定：cover + agenda + N content + 收尾，短 6-10 起、长内容更多
03horizontal-swipe 单文件 deck 形态（横向翻页）
04每套主题绑定完整调色板 + 字体 + accent，保证主题内部一致
05附带输入样例（example.md）：世界主题 + deck 标题 + 5 条 agenda
06CLI 关键词路由：replit / terminal / 终端 / 暗色 → deck-replit
07来源可标注到 replit.com/slides（frontmatter example_source_url）
3外部依赖
| 类型 | 依赖 |
|---|---|
| cli | 宿主本机 agent CLI（应用侧 spawn；非本 skill 指令） |
| network | Tailwind CDN（产物示例引用，非 skill 正文要求） |
| network | Google Fonts（产物示例引用） |
| network | 出处置标（frontmatter 元数据，非调用） |
4风险提醒 风险提醒：绿色 · 放心使用
风险提醒：绿色 · 放心使用
- 主题视觉由模型按名字重建，跨次一致性有限 — 正文只给主题名（helix/holm/…）与「有完整调色板 + 字体 + accent」，没有 hex 值；同一主题两次生成可能不同。
- 样例页数少（双页）易误导预期 — example.html 只演示 Cover + agenda，用户可能低估长内容下的篇幅。
- 预览 iframe 的 sandbox 组合偏宽（宿主侧） — template-picker.tsx:544 / preview-pane.tsx:297 = sandbox="allow-scripts allow-same-origin"。
- 用户内容逐字进 prompt（注入面） — assemblePrompt 原样拼接【用户内容】区块。
风险提醒：绿色，放心使用。判级对象＝skill 目录（SKILL.md + example.md + example.html）：无可执行脚本、无凭证读取、无写盘指令；SKILL.md 正文零 CDN/接口要求（唯一 URL 是 frontmatter 的 replit.com/slides 出处置标，非运行时调用）。目录内实际端点自证：example.html 有 cdn.tailwindcss.com 远程 script 与一条 fonts.googleapis.com @import，属产物引用。本仓 html-anything 模板按批4口径统一 🟢 绿档：判级对象＝skill 自身目录；宿主壳（loader.ts/assemblePrompt/本地 agent CLI/预览 iframe）与 example.html 里的字体、CDN 引用属产物期行为（由浏览器拉取、skill 执行时不外发），只写进 reason/risks，不判档。
5第二遍独立确认
- [ok] 文件清单（3 个文件，无脚本） — SKILL.md(1074B) + example.md(380B) + example.html(5051B)。
- [ok] 正文端点复核（仅元数据 URL） — SKILL.md 第 13 行 example_source_url = https://replit.com/slides（出处置标）；正文无 CDN/接口要求。
- [ok] 目录内端点自证 — example.html: cdn.tailwindcss.com（远程 script）+ fonts.googleapis.com（@import）。
- [ok] 无凭证读取 — key/secret/token/.env 零命中。
- [ok] 无写盘指令 — SKILL.md 无 write/save 类指令；shared.ts 明令禁文件工具。
- [ok] 8 套主题清单逐字可复核 — helix / holm / vance / bevel / world-dark / world-mint / atlas / bluehouse 全在正文与 example.md。
- [ok] 页数自决规则逐字可复核 — 「短内容 6-10 起步, 长内容应更多」原句存在。
- [ok] official_desc 逐字命中 — 与第 6 行 description 引号内文本一致。
6结论
适合：适合想用 Replit Slides 那种开发者风格的横向翻页 deck 做产品走查、内部技术 memo 的场景；8 套主题给了在「暗色开发者感」内部挑风格的空间。
不适合：不适合要求品牌色值精确一致的机构交付（主题不锁 hex）；不适合需要严格页数控制的场合（正文明确不设上限）；不适合演示型演讲（无讲者备注机制，该用 deck-presenter-mode）。
安装 agent 直装可复制
① 本站镜像 更新 2026-09-15
方式 A · 人下载镜像包下载 deck-replit.tar.gz
sha256:
方式 B · JSON 格式安装指南，复制给 agent7370702e0d48661d…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 为实时上游，内容可能已更新。