SuperAPI AI 工具集
合作ENAI 行业资讯收藏
Skill 广场html-export

html-export

办公与效率

查看项目

更新于 10-30 09:57

技能介绍

用途

html-export 用于将本地 HTML 文件转换为 PNG 截图、矢量 PDF、MP4 或 GIF。它通过一个入口点执行，并以退出码报告结果。该技能可由智能体或用户直接调用，也可由其他技能按路径运行脚本。无论哪种方式，导出器只负责渲染，从不安装、提交或发布任何内容。

主要能力

  • PNG 截图：支持页面错误与空白捕获检查，可生成视口截图或整页截图（--full-page），支持移动端渲染（--mobile）。
  • 矢量 PDF：支持打印模式（使用页面打印 CSS）和幻灯片模式（--slides），可将多个输入或幻灯片合并为一个 PDF。
  • MP4 / GIF 录制：确定性动画录制，支持帧率、时长、音频（仅 MP4）等参数。

使用方式

基本命令：

node .claude/skills/html-export/scripts/export.cjs --to=png page.html
node .claude/skills/html-export/scripts/export.cjs --to=pdf deck.html --page=1920x1080
node .claude/skills/html-export/scripts/export.cjs --to=mp4 intro.html --duration=4
node .claude/skills/html-export/scripts/export.cjs --help

--to 为必填项，没有默认目标。值标志可使用 =value 或下一个参数；--slides 仅接受附加形式。

安装（仅在用户要求时）

需要 Node.js 20 或更新版本，以及技能自身 node_modules 中的 Playwright 1.55.1 或更新版本（绝不使用父项目的副本）。从项目根目录运行：

# macOS/Linux shell
(cd .claude/skills/html-export && npm install && npx playwright install chromium)

# Linux 系统库
(cd .claude/skills/html-export && npx playwright install --with-deps chromium)

# Windows PowerShell
Push-Location .claude/skills/html-export; npm install; npx playwright install chromium; Pop-Location

# Windows cmd
pushd .claude\skills\html-export && npm install && npx playwright install chromium && popd

# ffmpeg，仅用于 mp4/gif（构建需包含 libx264 编码器）
Windows:            winget install Gyan.FFmpeg
macOS:              brew install ffmpeg
Linux (Debian/Ubuntu): sudo apt-get install ffmpeg

必须从技能文件夹内部安装，绝不使用 npm install --prefix。

环境变量

  • HTML_EXPORT_FFMPEG：固定 ffmpeg 构建，必须为绝对路径；Windows 上还必须指向 .exe 或 .com 文件。
  • HTML_EXPORT_FFPROBE：同上，用于 ffprobe。
  • HTML_EXPORT_CHROMIUM：使用此浏览器可执行文件渲染，必须为绝对路径；不能与 HTML_EXPORT_CHANNEL 组合使用。
  • HTML_EXPORT_CHANNEL：使用已安装的 chrome 或 msedge 渲染。
  • HTML_EXPORT_FALLBACK=0：关闭回退到其他已安装浏览器。
  • HTML_EXPORT_DEBUG=1：将意外错误的堆栈跟踪打印到 stderr。

通用选项

  • --out=<dir>：输出目录。默认：<project>/tmp/html-export/<YYMMDD-HHmm>-<first input name>/
  • --viewport=<WxH[,WxH]>：视口大小；逗号列表仅用于 png。
  • --slides[=<css>]：导航幻灯片或屏幕；裸形式使用默认选择器 section.slide[data-slide-id], [data-export-slide]。
  • --page=<WxH>：PDF 页面大小（CSS 像素），仅打印模式。
  • --scale=<n>：设备缩放因子，大于 0。
  • --timeout=<ms>：超时毫秒数（默认 30000，最大 2147483647）。
  • --offline：使页面离线，除输入本身外仅加载本地 file: URL。
  • --allow-errors：接受页面错误；绝不接受空白捕获或失败步骤。
  • --self-check：先渲染已知良好的夹具；仅 png。
  • --help：打印用法并退出 0。

各目标选项

PNG：--full-page 和 --mobile（均为可选）。默认视口 1440x900,390x844。

PDF：--order=<file>，每行一个 .html/.htm 路径。打印模式为默认；幻灯片模式使用 --slides。

MP4/GIF：--fps=<1-60>（mp4 默认 30，gif 默认 15）、--duration=<seconds>、--audio=<local file>（仅 mp4）、--gif-width=<px>（仅 gif，默认 960）、--keep-frames。

退出码

  • 0：成功。
  • 1：工具故障（浏览器启动、写入错误等）。
  • 2：用法错误。
  • 3：依赖缺失，不可验证。
  • 4：页面导致的失败、空白捕获或页面错误。

信任与安全

仅渲染项目或用户生成的 HTML。对于从网络获取或不可信的 HTML，始终传递 --offline。Chromium 在无操作系统沙箱的情况下运行，页面可将用户可读的任何本地文件嵌入 PNG、PDF 或视频。--offline 阻止页面网络流量，但不是沙箱，嵌入的本地文件仍会进入输出。

适用场景

  • 将演示文稿、模型图、报告和草稿导出为 PNG、PDF、MP4 或 GIF。
  • 与其他技能配合使用，例如 presentation-builder、feature-presentation、work-item（mockup 模式）等。

限制

  • 需要 Node.js 20+ 和 Playwright 1.55.1+；MP4/GIF 需要 ffmpeg（含 libx264）。
  • 依赖为可选安装，缺失时退出 3，不会自动安装。
  • --to 必填，无默认目标。
  • 视频输入仅限一个 HTML 文件。
  • --full-page 与 --slides 组合会退出 2。
  • --page 与 --slides 组合为用法错误。
  • 具体收费、价格、平台支持等信息暂未提供。