SuperAPI AI 工具集

html-deck

前端与建站

查看项目

更新于 10-15 23:24

技能介绍

用途:从产品文档、笔记或大纲生成演示级 HTML 幻灯片,并导出尺寸精确的 PDF;适合需要应用截图或产品视觉素材的演示场景。

主要能力:提供 Domo 主题骨架(含页眉、内容区、页脚与 logo 数据 URI 占位符);内置表格、流程/管道、卡片网格、架构图、截图展示、信息框等版式模式;规定字号、颜色变量与间距规则;提供打印安全 CSS(@media print 中去除 box-shadow、page-break-after: always、page-break-inside: avoid);附带维护好的 PDF 转换脚本 references/convert-to-pdf.js。

使用方式:先读取 references/domo-theme.md 复制完整骨架,并用 references/assets/logo-data-uri.txt 替换 LOGO_DATA_URI;标准尺寸为 --slide-w: 1024px、--slide-h: 576px;转换时执行 npm install puppeteer-core,再运行 node convert-to-pdf.js path/to/deck.html path/to/deck.pdf(省略第二个参数则输出到 HTML 同目录)。脚本使用 puppeteer-core 配合系统 Chrome,设置 deviceScaleFactor: 2、printBackground: true、零边距,并等待 document.fonts.ready。最后对 HTML 与 PDF 逐页截图比对,检查页数、页脚遮挡、字体加载、图片渲染、阴影色块与页面边缘。

限制:必须使用 Domo 主题骨架,不得跳过;不要重写转换脚本;图片路径需 URL 编码空格,避免特殊 Unicode 文件名;内容密集页需去掉垂直居中并压缩间距;PDF 中 box-shadow 会渲染为深色块,必须由打印 CSS 去除。其他收费、平台与效果信息暂未提供。