微信排版主题提取
将以下提示词粘贴到你的 AI 对话框中:
请根据 https://skillhub.cn/install/skillhub.md,安装 @kunlungrowth/wechat-theme-extractor。
技能介绍
解决手动配置样式的痛点
在开发微信公众号排版工具时,markdown-wechat-converter 等转换器的默认主题往往难以满足特定品牌或文章风格的需求。手动编写 CSS 提取配色、字体和间距不仅耗时,而且难以精准对齐原文章的视觉层级。这种“看着好写起来烦”的样式还原工作,正是本文要解决的问题。
核心能力与工作流
该技能的核心在于将现有公众号文章的排版特征自动蒸馏为结构化的主题配置。其工作流主要分为四个关键步骤:
- 源码获取:接收用户提供的文章链接或 HTML 源码,自动提取
js_content正文片段与文章标题。 - 样式分析:解析正文 HTML 节点,精准识别颜色、字号、行高、标题层级以及引用块等视觉特征。
- 生成主题:基于分析结果,生成包含
id、name及核心排版样式(如body、h1、blockquote)的原始主题对象。 - 写入与预览:在项目工作区定位
markdown-to-wechat.html,通过分析文件结构将新主题追加或更新到配置区域,并调用浏览器实时预览。
适用边界与注意点
该工具定位于“设计师蒸馏”逻辑,旨在提炼排版样式而非复制受保护的品牌标识。它专为微信公众号文章设计,不适用于普通网页链接。此外,其自动写入功能依赖于目标项目已存在 markdown-to-wechat-converter 及对应的 HTML 配置文件。若文件结构无法被安全识别,技能会停止写入并提示人工介入,确保配置不被破坏。
使用场景
- 拿到一篇排版精美的公众号文章,需要将其配色和字号提取出来,生成新主题写入项目的转换器配置中。
- 项目里的 markdown-to-wechat.html 缺少某种特定风格的排版,需要从一篇参考公众号文章中蒸馏样式并追加进去。
- 修改完微信排版主题配置后,需要立即在浏览器中打开目标 HTML 文件,验证新主题的视觉呈现效果。
适合人员
- 负责开发微信公众号排版工具的工程师,诉求是通过文章快速生成自定义主题配置以减少手写 CSS 的时间。
- 维护 markdown-wechat-converter 项目的开发者,诉求是能够安全地更新或追加主题对象而不破坏原有代码结构。
- 需要频繁调整公众号文章视觉风格的运营或设计人员,诉求是通过现有文章一键获取排版参数并实时预览效果。