WeChat MD

WeChat MD 是一个本地优先的微信公众号 Markdown 写作与排版工作台。它把 Markdown 编辑、公众号效果预览、文章模板、排版风格、公众号文章提取、图片资源管理和发布前检查放在同一个工作区中，适合需要反复写作、调整样式并发布到微信公众号的个人创作者。

主要特点

所有文章、排版风格、模板、组件和版本记录默认保存在本地。
编辑器与公众号预览实时联动，修改 Markdown 后立即看到排版结果。
风格统一决定配色、字体、字号、行距和文章排版结构，切换时不会替换正文或创建新文章。
内容模板提供可直接开始编辑的 Markdown 文章骨架，只在“新建文章”流程中选择，不会覆盖当前文章。
支持从微信公众号文章提取正文、图片和可复用的排版样式。
支持将内容复制为适合微信公众号编辑器的富文本，并导出 Markdown、HTML 或完整工作区备份。
网页端无需安装桌面程序，Windows 桌面端则提供本地 SQLite 和图片文件归档能力。

功能说明

文章库

左侧文章栏用于管理全部文章，包含搜索、收藏、已发布、回收站和文章数量统计。文章支持重命名、复制、收藏、标记发布、移入回收站、恢复和永久删除。文章列表独立滚动，搜索栏与导航区域保持固定。

首次打开时会提供一篇完整的 WeChat MD 使用教程示例，方便直接体验编辑、预览、模板、风格、图片和发布检查流程。之后新建、导入或提取的文章会按照正常流程保存在本地文章库中。

Markdown 编辑器

支持标准 Markdown 和 GFM 表格、任务列表、代码块、引用等语法。
显示行号，可切换到文章大纲并按标题快速定位。
支持上传、粘贴和拖拽图片，图片会先保存到本地资源库，再以稳定的资源引用插入正文。
文章修改采用 5 秒防抖自动保存，离开页面时会尝试立即保存最新内容。
编辑内容会额外生成一份 2 秒防抖的异常退出恢复快照；如果程序在正式保存前关闭，下次启动会询问恢复或忽略，不会创建文章副本。
文章切换前会创建安全留档；版本历史可以逐行查看历史版本与当前正文的新增、删除和标题、风格变化，再决定是否恢复。

双向定位与双栏同步

默认开启双栏同步滚动，编辑器和预览会按照文章进度平滑跟随。
点击预览中的段落、标题、引用或列表，可以定位到左侧对应 Markdown 行。
在编辑器中选择或点击文本，可以定位到右侧对应预览内容并高亮。
关闭双栏同步只会停止滚动跟随，不会关闭双向点击定位。

公众号预览

预览区提供桌面和手机两种设备尺寸，可打开或隐藏右侧排版设置栏。预览设置单独包含全局、标题、正文、引用、代码、列表、表格、图片、分割线、链接和其他样式入口，修改后会立即反映到当前文章。

内容模板

内容模板是带有实际 Markdown 正文骨架的文章模板，当前内置模板包括：

教程指南
新闻报道
资讯速览
经验分享
产品介绍

点击“新建文章”后，可以选择空白文章或任意内容模板。选择模板会以模板正文新建文章；当前文章不会被覆盖。用户也可以从“更多操作”中保存当前正文为模板，之后在新建文章时重复使用。

排版风格

风格统一决定文章的颜色、字体、字号、行距，以及标题、章节、引用、代码块、列表、表格和图片表现。顶部不再单独提供“版式”入口。

项目内置 默认 · 简洁、暖色 · 阅读、墨色 · 长文 三套基础视觉预设，并将它们与适合不同文章类型的排版结构组合成以下七种可直接选择的文章风格：

默认 · 简洁：清爽、克制，适合教程、资讯和日常更新。
教程 · 清晰：突出步骤、说明和操作提示。
新闻 · 严谨：强化标题、导语与信息层级。
资讯 · 清爽：适合资讯整理、分析和总结。
暖色 · 阅读：更柔和，适合故事、随笔和生活内容。
产品 · 醒目：突出卖点、功能和行动引导。
墨色 · 长文：对比明确，适合深度文章和长篇阅读。

可以在右侧排版设置中调整细节，并将调整结果保存为自定义风格。自定义风格支持继续编辑、重命名、重置到基础预设和删除。

组件库

组件用于复用固定内容片段，例如提示框、作者介绍、关注引导、文章结尾和常用说明。组件页面按类别展示，并采用分页方式避免面板出现过长的纵向滚动。选中编辑器文本后，可以将其保存为自定义组件；插入后的内容仍然是普通 Markdown，可以继续修改。

提取公众号文章

点击顶部“提取公众号”。
粘贴 https://mp.weixin.qq.com/ 文章链接。
等待正文、图片和可识别排版样式提取完成。
选择保存文章，或只应用提取出的部分风格。

保存后，文章正文会转换为 Markdown，远程图片会下载到本地资源库。桌面端还会将图片写入软件设置中指定的文件夹，默认位置为安装目录根目录下的文章图片目录。网页端受浏览器权限限制，图片主要由浏览器本地资源库管理。

图片资源库

图片资源库集中管理上传、粘贴、拖拽和公众号提取得到的图片。资源从正文移除后会标记为“未使用”，不会立即删除，便于误删后重新插入。资源库支持查看缩略图、插入当前文章、从文章移除和删除未使用资源。

导入、导出与备份

导入 Markdown：将本地 .md 文件作为新文章加入文章库。
导出 Markdown：导出当前文章的原始 Markdown 内容。
导出 HTML：导出适合保存或继续处理的 HTML 文件。
复制到公众号：生成带内联样式的富文本，并同时准备纯文本内容。
工作区备份：将文章、风格、模板、组件、版本和图片打包为一个备份文件。
工作区恢复：读取备份并合并到当前工作区，遇到 ID 冲突时会生成新的本地 ID。

复制或发布前可以运行发布检查，检查图片是否加载、文章是否为空以及常见的排版问题。

运行环境

网页端

需要 Node.js 24 或更高版本。

npm install
npm run dev

打开 http://localhost:5173/ 即可进入编辑器。组件展示页位于 http://localhost:5173/?view=components。

网页端数据保存在浏览器 IndexedDB 中。清理浏览器站点数据会删除本地文章和资源，重要内容请定期导出工作区备份。

Windows 桌面端

桌面端需要 Node.js、Rust、Cargo 以及 Tauri 所需的 Windows 桌面开发环境。

开发模式：

npm run tauri:dev

构建安装包：

npm run tauri:build

构建完成后，可直接运行的程序和安装包分别生成在：

src-tauri/target/release/wechat-md.exe
src-tauri/target/release/bundle/msi/
src-tauri/target/release/bundle/nsis/

桌面端启动时默认最大化，并使用 Windows 原生窗口标题栏和窗口控制；应用内容从操作工具栏直接开始，不再显示网页端的品牌介绍栏。桌面端数据保存在本地 SQLite 数据库中。公众号图片的文件保存位置可以从右侧设置入口打开“软件设置”修改，也可以恢复默认目录。桌面端会屏蔽页面右键菜单，避免把应用内容误当作浏览器网页另存或打印。

常用命令

# 启动 Vite 网页开发服务
npm run dev

# 启动 Windows 桌面开发模式
npm run tauri:dev

# 执行全部前端测试
npm run test:run

# TypeScript 类型检查
npm run typecheck

# 构建网页端产物
npm run build

# 构建 Windows 桌面安装包
npm run tauri:build

项目结构

src/
├─ app/                  应用壳层、工作区状态和示例文章
├─ components/           编辑器、预览、侧栏、设置和 UI 组件
├─ features/articles/    文章模型与文章仓储
├─ features/assets/      图片资源、Markdown 资源引用和本地化
├─ features/backup/      工作区备份与恢复
├─ features/clipboard/   微信富文本复制与 HTML 序列化
├─ features/components/  可复用内容组件
├─ features/export/      Markdown、HTML 导出
├─ features/publication/ 发布前检查
├─ features/recovery/    异常退出草稿恢复
├─ features/styles/      风格预设与样式展示
├─ features/sync/        双向定位、滚动同步和动画滚动
├─ features/layouts/     文章版式预设
├─ features/templates/   Markdown 内容模板与旧数据迁移
├─ features/versions/    文章版本历史
├─ features/wechat/      公众号文章解析和风格提取
├─ platform/             网页端与桌面端服务适配
└─ styles/               全局设计令牌和基础样式

server/                  Vite 开发/预览时使用的公众号和图片请求接口
src-tauri/               Tauri 2 桌面端入口、网络请求和本地文件能力

数据与隐私

WeChat MD 不要求登录，也没有内置云端同步。网页端的文章和图片只保存在当前浏览器的本地存储中；桌面端则保存在本机 SQLite 和用户指定的图片目录中。提取公众号文章时，桌面端会请求公众号页面和公开图片地址，网页端会通过本地开发服务完成对应请求。

请注意：工作区备份包含文章正文、版本历史、模板、组件和图片资源，应像管理普通文档一样妥善保存和传输。

常见问题

预览页面空白

确认开发服务仍在运行，并访问 http://localhost:5173/。如果端口被占用，停止旧的 Vite 进程后重新运行 npm run dev。

公众号图片没有显示

先打开图片资源库确认图片是否已经保存。桌面端还要检查“软件设置”中的图片目录是否存在且具有写入权限。网络图片可能因为原站限制、失效链接或超过大小限制而下载失败，文章会保留原始链接并在保存提示中说明。

双栏同步滚动不顺畅

可以关闭“双栏同步”，这只会停止滚动跟随；预览点击定位和编辑器选中定位仍然可用。刷新页面后会恢复上次保存的同步开关状态。

如何恢复误删文章

文章移入回收站后可以在回收站中恢复；永久删除无法通过应用内操作恢复。删除或清空文章库前，建议先导出工作区备份。

开发检查

提交代码前建议依次执行：

npm run typecheck
npm run test:run
npm run build
cargo test --manifest-path src-tauri/Cargo.toml

当前项目使用 React、TypeScript、Vite、Tauri 2、SQLite、IndexedDB、React Markdown 和 Radix UI 组件构建。