SuperAPI AI 工具集

canghe-markdown-to-html

写作与研究

查看项目

更新于 10-15 13:42

技能介绍

canghe-markdown-to-html 用于把 Markdown 文件转换成为带样式的 HTML,输出采用内联 CSS,针对微信公众号(WeChat Official Account)及其他平台做了优化。它属于 canghe-skills 中的一个技能,来源为 freestylefly/canghe-skills。

【主要能力与支持的 Markdown 特性】 支持的语法与元素包括:

  • 标题:# H1 到 ###### H6
  • 粗体/斜体:bold、italic
  • 代码块:```lang,带语法高亮
  • 行内代码:code
  • 表格:GitHub 风格 Markdown 表格
  • 图片:
  • 链接:text,支持脚注引用
  • 引用块:> quote
  • 列表:无序列表与有序列表
  • Alerts:> [!NOTE]、> [!WARNING] 等
  • 脚注:[^1] 引用
  • Ruby 文本
  • Mermaid:```mermaid 图表
  • PlantUML:```plantuml 图表

【主题】 提供三种主题(转换前会通过 AskUserQuestion 确认,除非用户已指定):

  • default(推荐):经典主题,传统排版,标题居中带底边,二级标题白字彩底。
  • grace:优雅主题,文字阴影、圆角卡片、精致引用块(by @brzhang)。
  • simple:简洁主题,现代极简风、不对称圆角、清爽留白(by @okooo5km)。

【使用方式】 脚本目录以本 SKILL.md 所在目录作为 SKILL_DIR,使用 ${SKILL_DIR}/scripts/<name>.ts。主入口为 scripts/main.ts。 转换命令: npx -y bun ${SKILL_DIR}/scripts/main.ts <markdown_file> --theme <theme>

完整用法: npx -y bun ${SKILL_DIR}/scripts/main.ts <markdown_file> [options]

选项:

  • --theme <name>:主题名称(default、grace、simple),默认 default
  • --title <title>:覆盖 frontmatter 中的标题
  • --keep-title:保留内容中的第一个标题(默认移除,false)
  • --help:显示帮助

示例:

  • 基础转换(使用默认主题,移除第一个标题):npx -y bun ${SKILL_DIR}/scripts/main.ts article.md
  • 指定主题:npx -y bun ${SKILL_DIR}/scripts/main.ts article.md --theme grace
  • 保留第一个标题:npx -y bun ${SKILL_DIR}/scripts/main.ts article.md --keep-title
  • 覆盖标题:npx -y bun ${SKILL_DIR}/scripts/main.ts article.md --title "My Article"

【工作流程】 Step 0:预检查(中文内容)——仅当输入文件包含中文文本时执行。检测方式为读取输入 Markdown 文件,检查是否包含 CJK(中/日/韩)字符;若无 CJK 内容则跳到 Step 1。若检测到 CJK 内容且 canghe-format-markdown 技能可用,会用 AskUserQuestion 询问是否先格式化。格式化可修复:标点内含粗体标记导致 ** 解析失败、CJK/英文间距问题。用户同意则调用 canghe-format-markdown 格式化后再作为输入;拒绝则继续用原文件。 Step 1:确认主题(见上文主题表)。 Step 2:转换,执行上述命令。 Step 3:报告结果,显示 JSON 结果中的输出路径;若创建了备份也需说明。

【配置扩展(EXTEND.md)】 用 Bash 按优先级检查 EXTEND.md 是否存在:

  • 项目级:test -f .canghe-skills/canghe-markdown-to-html/EXTEND.md && echo "project"
  • 用户级(跨平台,$HOME 适用于 macOS/Linux/WSL):test -f "$HOME/.canghe-skills/canghe-markdown-to-html/EXTEND.md" && echo "user" 路径位置:项目目录 .canghe-skills/canghe-markdown-to-html/EXTEND.md;用户主目录 $HOME/.canghe-skills/canghe-markdown-to-html/EXTEND.md。 结果处理:找到则读取、解析并应用设置;未找到则使用默认值。 EXTEND.md 支持:默认主题、自定义 CSS 变量、代码块样式。

【Frontmatter】 支持 YAML frontmatter 元数据,例如:

title: Article Title author: Author Name description: Article summary

若未找到标题,则从第一个 H1/H2 标题提取,或使用文件名。

【输出】 输出文件位置与输入 Markdown 文件同目录。输入 /path/to/article.md,输出 /path/to/article.html。 冲突处理:若 HTML 文件已存在,会先备份:/path/to/article.html.bak-YYYYMMDDHHMMSS。 JSON 输出到 stdout,包含 title、author、summary、htmlPath、backupPath、contentImages(含 placeholder、localPath、originalPath)等字段。

【适用场景与限制】 适用于将 Markdown 文章转换为可发布(尤其面向微信公众号等平台)的带样式 HTML,并借助代码高亮、数学公式、PlantUML、脚注、Alerts、信息图等能力丰富排版。资料未说明运行环境要求之外的平台限制、收费情况、性能指标或效果保证,相关细节暂未提供。