目录为什么又造一个轮子它做什么为什么不上传你的文章7 套主题不只是换颜色实现原理如何使用开源 本地运行最后为什么又造一个轮子写公众号几年排版一直是我最不想面对的事。市面上的编辑器要么臃肿要么收费要么把自己当成一个平台——注册、登录、云端同步十几篇文章就提示会员。我只需要一个东西把 Markdown 变成能直接粘贴到公众号后台的富文本其他别替我操心。没找到就自己写了一个。它做什么打开网页左边写 Markdown右边实时预览手机效果。写完点复制正文粘贴到公众号后台——标题、作者、封面在后台自己填工具不管。主界面截图核心功能就这么简单支持标题、引用、列表、链接、图片、代码块7 套排版主题一键切换文章库存浏览器里不上传任何数据JSON 导出备份HTML 导出完整文章为什么不上传你的文章所有数据存在你当前浏览器的 localStorage 里。没有后端没有数据库没有用户系统。这意味着你的草稿不会经过任何服务器换台电脑不会同步但可以导出 JSON 手动迁移清理浏览器数据会丢失所以建议定期导出备份把文章存自己手里是我做这个工具的底线。7 套主题不只是换颜色每套主题的标题、引文、代码块、边框都单独调过不是简单换了个 accent 色值。青绿、墨蓝、暖橙、酒红、紫灰、极简灰、湖蓝——覆盖了大多数公众号的场景。实现原理核心逻辑不到 400 行没引入任何 Markdown 解析库几个关键设计逐行解析。Markdown 按行读取每行判断类型标题、引用、列表、代码块、图片直接生成带内联样式的 HTML。不用 AST不用虚拟 DOM扫一遍就出结果。内联样式。微信公众号编辑器会过滤style标签和外部样式表所以渲染出的每个元素都带着行内style属性确保粘贴后样式不丢。主题即配置。7 套主题各是一组颜色变量——强调色、软背景、标题色、正文色、边框色、代码底色。切换主题只换这组变量渲染逻辑完全复用。Clipboard API 双通道。复制正文时同时写入text/html和text/plain前者给公众号编辑器保留格式后者给普通文本框降级使用。如何使用clone 项目到本地npm install npm run dev浏览器打开http://localhost:3000开始写文章点复制标题 → 粘贴到公众号后台标题栏点复制正文 → 粘贴到公众号编辑器在后台填作者、封面发布不需要登录不需要安装浏览器打开就能用。开源 本地运行纯前端项目Vite React TypeScriptMIT 协议。git clone https://github.com/lxw112190/wechat-article-formatter.git cd wechat-article-formatter npm install npm run dev浏览器打开http://localhost:3000就能用。最后如果你也觉得公众号排版在消耗写东西的热情试试这个工具。有用就点个 Star有问题提 Issue。写文章本身已经够难了排版不该是阻力。
写了一款公众号排版工具,开源了
目录为什么又造一个轮子它做什么为什么不上传你的文章7 套主题不只是换颜色实现原理如何使用开源 本地运行最后为什么又造一个轮子写公众号几年排版一直是我最不想面对的事。市面上的编辑器要么臃肿要么收费要么把自己当成一个平台——注册、登录、云端同步十几篇文章就提示会员。我只需要一个东西把 Markdown 变成能直接粘贴到公众号后台的富文本其他别替我操心。没找到就自己写了一个。它做什么打开网页左边写 Markdown右边实时预览手机效果。写完点复制正文粘贴到公众号后台——标题、作者、封面在后台自己填工具不管。主界面截图核心功能就这么简单支持标题、引用、列表、链接、图片、代码块7 套排版主题一键切换文章库存浏览器里不上传任何数据JSON 导出备份HTML 导出完整文章为什么不上传你的文章所有数据存在你当前浏览器的 localStorage 里。没有后端没有数据库没有用户系统。这意味着你的草稿不会经过任何服务器换台电脑不会同步但可以导出 JSON 手动迁移清理浏览器数据会丢失所以建议定期导出备份把文章存自己手里是我做这个工具的底线。7 套主题不只是换颜色每套主题的标题、引文、代码块、边框都单独调过不是简单换了个 accent 色值。青绿、墨蓝、暖橙、酒红、紫灰、极简灰、湖蓝——覆盖了大多数公众号的场景。实现原理核心逻辑不到 400 行没引入任何 Markdown 解析库几个关键设计逐行解析。Markdown 按行读取每行判断类型标题、引用、列表、代码块、图片直接生成带内联样式的 HTML。不用 AST不用虚拟 DOM扫一遍就出结果。内联样式。微信公众号编辑器会过滤style标签和外部样式表所以渲染出的每个元素都带着行内style属性确保粘贴后样式不丢。主题即配置。7 套主题各是一组颜色变量——强调色、软背景、标题色、正文色、边框色、代码底色。切换主题只换这组变量渲染逻辑完全复用。Clipboard API 双通道。复制正文时同时写入text/html和text/plain前者给公众号编辑器保留格式后者给普通文本框降级使用。如何使用clone 项目到本地npm install npm run dev浏览器打开http://localhost:3000开始写文章点复制标题 → 粘贴到公众号后台标题栏点复制正文 → 粘贴到公众号编辑器在后台填作者、封面发布不需要登录不需要安装浏览器打开就能用。开源 本地运行纯前端项目Vite React TypeScriptMIT 协议。git clone https://github.com/lxw112190/wechat-article-formatter.git cd wechat-article-formatter npm install npm run dev浏览器打开http://localhost:3000就能用。最后如果你也觉得公众号排版在消耗写东西的热情试试这个工具。有用就点个 Star有问题提 Issue。写文章本身已经够难了排版不该是阻力。