html-to-wechat
把任意 HTML 转成微信公众号编辑器兼容格式。核心原理：微信编辑器只保留内联样式，会剥离 <style>、外部 CSS、class/id 和 JS——所以转换 = CSS 全量内联 + 标签/属性白名单清洗。
何时使用
- 把生成的 HTML（AI 日报、GitHub 榜单、数据报告、卡片页等）发布到微信公众号。
- 用户抱怨「HTML 粘贴到公众号编辑器后样式全没了」。
- 任何「HTML → 公众号文章/推文格式」的需求。
执行流程
- 确认依赖：脚本仅需
beautifulsoup4。检查托管 Python 环境是否已安装，缺失则安装：
bash ~/.workbuddy/binaries/python/envs/default/bin/pip install beautifulsoup4 - 运行转换脚本：
bash ~/.workbuddy/binaries/python/envs/default/bin/python \ ~/.workbuddy/skills/html-to-wechat/scripts/html2wechat.py <input.html> [-o <output.html>]
- 默认输出<输入名>.wechat.html（带预览外壳，白色画布模拟公众号正文区）。
---fragment：只输出正文片段（需要嵌入其他流程时用）。
---css extra.css：额外内联外部样式表（可多次指定）。 - 阅读脚本输出的 ⚠️ 注意事项，并向用户传达关键项：本地/base64 图片需在编辑器重新上传、外链不可点击、被移除的样式属性。
- 用
present_files交付输出文件，并告知使用方式：浏览器打开 → Cmd/Ctrl+A 全选 → 复制 → 粘贴进公众号编辑器。
样式保留策略（脚本已内置）
<style>标签与同目录本地<link>样式表全部解析并按 (specificity, order) 内联；元素原有style属性优先级最高。- 自动解析 CSS 变量并替换
var(--x)：支持:root全局变量，也支持写在元素/祖先style里的局部变量（如style="--accent: #f00"，AI 生成页面给卡片逐条上色的常见写法，就近覆盖）。 div/article/figure等容器标签改名为section，figcaption→p。- 删除
script/iframe/svg/canvas/video/audio/form等黑名单标签并逐条告警。 - 移除
position/transform/animation/float/box-shadow等微信不支持的 CSS 属性并告警。 img自动补max-width:100%; height:auto。
重要提醒（转换后必须告诉用户）
- 图片：本地路径和 base64 图粘贴后无法显示，需在编辑器重新上传；http(s) 外链图编辑器会尝试转存但可能失败。
- 链接：普通订阅号正文外链不可点击，引流链接放「阅读原文」或做成二维码图片。
- SVG/图表：内联 SVG 会被删除，需先导出 PNG。
- 更详细的兼容规则查
references/wechat-rules.md。
常见取舍
- 脚本保守删除
box-shadow和display:flex/grid（编辑器粘贴后不稳定）。若用户坚持保留 flex 布局，可手动在输出文件里加回内联display:flex并实测目标账号的粘贴效果。 - 大面积深色底在微信夜间模式下可能反转，转换前可与用户确认是否改为浅色版式。
