[LLM 实战] 我写了一个 Claude Skill，专门“逆向”公众号排版样式
本帖最后由 caroline 于 2025-12-31 15:03 编辑# 我写了一个 Claude Skill，专门“逆向”公众号排版样式
作为一名习惯了 Markdown + Git 工作流的开发者，微信公众号的富文本编辑器一直是我的噩梦。
每次写完技术文章，从 Markdown 渲染到公众号，总是要经历极其痛苦的样式调整：调行间距、给代码块找背景色、给引用加边框……市面上的排版工具（如 mdnice 等）虽然好用，但模板有限。有时候看到别的技术大佬（比如“小道消息”或“架构师之路”）那种极简又舒服的排版，想复刻一套，却发现需要手动去 F12 扒 CSS，极其低效。
**既然这是重复性劳动，且涉及非结构化数据处理（CSS 解析），这不正是 LLM（Claude）最擅长的领域吗？**
于是，我花了一个周末，写了一个 Agent Skill，实现了**端到端的样式克隆**。
### 核心思路
这个 Skill 的工作流其实是一个典型的 RAG + 逆向工程的变体：
1.**Input**：目标公众号文章 URL。
2.**Fetch & Clean**：绕过微信的反爬机制，获取 HTML。
3.**Analysis (LLM)**：将杂乱的内联样式（Inline Styles）喂给 Claude，让它提取语义化特征（哪个是二级标题样式？哪个是引用样式？）。
4.**Generation**：输出符合我本地渲染器规范的 JSON/CSS 配置。
5.**Deploy**：自动 Commit 到本地仓库，即刻可用。
### 技术难点与解决
在实现过程中，主要解决了两个非 AI 的工程问题，和一个 AI 理解问题：
#### 1. 微信的“软”反爬
直接用 `requests.get()` 访问微信文章链接通常会返回空或者验证页。
**Hack 方案**：
这里没有用太重的 Selenium/Puppeteer，而是通过定制 `curl` 命令配合特定的 `User-Agent` 和 `Accept` 头，伪装成标准浏览器行为。目前实测，这种轻量级方案对单次请求的成功率在 99% 以上，且速度极快。
#### 2. CSS 的语义化提取
这是最有趣的部分。传统的爬虫只能把 `style="color: red; font-size: 16px"` 扒下来，但不知道这是“正文”还是“标题”。
我设计了一套 Prompt，让 Claude 充当“前端解析器”。它不仅是提取，还会进行**归纳**。
* 比如：它会识别出文中所有的 `h2` 标签，分析它们的共性，过滤掉偶发的特殊样式，总结出“标准二级标题样式”。
* 甚至连代码块（`pre/code`）的配色方案，也能通过 LLM 转换成对应的 Token。
### 效果
现在我的发文流程变成了：
1. 逛公众号，看到排版顺眼的（比如某个技术大厂的发布文）。
2. 复制链接，运行脚本：`run_skill <url>`。
3. 等待 10-30 秒。
4. 本地渲染器里多了一个同名主题，直接 Render。
### 开源与复盘
在这个过程中，我深刻体会到 **Agent Skills** 对于个人工作流的改造能力。我们不再需要手写正则去匹配复杂的 HTML，LLM 的容错率和理解力让“逆向工程”变得异常简单。
我将整个开发过程、核心代码逻辑以及如何绕过反爬的具体实现，详细整理了一篇复盘文章。如果你对 **LLM 应用开发**、**自动化工具构建** 或者单纯想**白嫖一套排版工具**感兴趣，欢迎参考：
👉 **技术复盘：10秒学会！Claude Skill 轻松复刻任意公众号样式！**
（文章里包含了核心逻辑的解析和后续优化的方向，欢迎来公众号交流共学习） 不错不错 利害 感谢 大佬厉害👍
页:
[1]