[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"project-2772":3},{"id":4,"name":5,"fullName":6,"owner":7,"repo":5,"description":8,"homepage":9,"htmlUrl":10,"language":11,"languages":10,"totalLinesOfCode":10,"stars":12,"forks":13,"watchers":14,"openIssues":15,"contributorsCount":16,"subscribersCount":16,"size":16,"stars1d":17,"stars7d":18,"stars30d":19,"stars90d":16,"forks30d":16,"starsTrendScore":20,"compositeScore":21,"rankGlobal":10,"rankLanguage":10,"license":22,"archived":23,"fork":23,"defaultBranch":24,"hasWiki":25,"hasPages":23,"topics":26,"createdAt":10,"pushedAt":10,"updatedAt":27,"readmeContent":28,"aiSummary":29,"trendingCount":16,"starSnapshotCount":16,"syncStatus":15,"lastSyncTime":30,"discoverSource":31},2772,"rico-md","ricocc\u002Frico-md","ricocc","Rico 的公众号排版编辑工具","https:\u002F\u002Fmd.ricoui.com\u002F",null,"JavaScript",168,32,1,2,0,7,13,34,21,68.46,"MIT License",false,"master",true,[],"2026-06-12 04:00:15","# Rico MD - 公众号 Markdown 编辑器\n\n一个面向微信公众号写作与排版的纯前端 Markdown 编辑器，支持实时预览、代码块主题、图片本地持久化与一键复制富文本。\n\n\n## 在线地址\n\n- [https:\u002F\u002Fmd.ricoui.com](https:\u002F\u002Fmd.ricoui.com\u002F)\n\n\n## 仓库地址：\n\n- https:\u002F\u002Fgithub.com\u002Fricocc\u002Frico-md\u002F\n\n## Screenshot\n\n![](.\u002Fassets\u002Fimages\u002Fcover-index.jpg)\n\n![](.\u002Fassets\u002Fimages\u002Fcover-setting.jpg)\n\n\n## 核心能力\n\n### 1. 编辑与预览\n- 左侧 Markdown 编辑，右侧实时预览。\n- 支持常用编辑快捷操作（标题、加粗、斜体、引用、代码块、分割线、表格等）。\n- 支持桌面\u002F手机预览模式切换。\n\n### 2. 文档管理\n- 支持多文档创建、切换、复制、删除、搜索。\n- 删除操作使用确认弹窗，避免误删。\n- 删除最后一篇文档后会自动创建一篇空白文档，保证始终有可编辑文档。\n- 文档与当前激活状态会持久化到 `localStorage`。\n\n### 3. 自动保存与保存状态\n- 输入后采用固定 `5 秒` 防抖自动保存。\n- 状态栏显示 `保存中 \u002F 已保存 \u002F 保存失败` 与最后保存时间。\n- 保留显式保存快捷键：`Ctrl\u002FCmd + S`。\n\n### 4. 主题与代码面板\n- 内置多套公众号排版主题（当前 20 套），按风格分类：\n  - **简约主义**：默认、极简、科技、优雅简约、沉浸阅读、Jony Ive\n  - **技术阅读**：Anthropic、Wired、Medium 阅读、Apple 极简、AI Coder\n  - **传统质感**：纸纪、晚点深度、金融时报、墨线·报纸、杂志\n  - **设计灵感**：素白·留白、赭红·编辑、素灰·清水、赤陶·有机、墨蓝·卫报、朱红·日经、素墨·世界报\n- 代码面板支持独立代码主题（当前 16 套）。\n\n\n### 5. 图片处理（本地优先）\n- 支持粘贴、拖拽、工具栏上传图片。\n- 使用 Canvas 压缩（保留 GIF\u002FSVG 策略）后写入 IndexedDB。\n- 编辑器内使用 `img:\u002F\u002F` 短链接，避免大段 Base64 影响输入性能。\n- 渲染时从 IndexedDB 读取并替换为可预览 URL。\n- 复制到公众号时自动转换为 Base64，提升粘贴兼容性。\n\n### 6. 导出与复制\n- 一键复制到公众号（富文本 HTML）。\n- 支持复制纯文本。\n- 支持导出 `.md` 与 `.html`。\n\n### 7. About 页面\n- 顶部导航新增\"关于\"，跳转到独立页面 `about.html`。\n- 页面包含作者介绍、标签、知识库链接与联系方式二维码展示。\n\n## 技术栈\n\n- Vue 3（CDN）\n- markdown-it\n- highlight.js\n- turndown\n- IndexedDB\n- Canvas API\n- 原生 ES Modules + 纯 CSS\n\n## 本地运行\n\n```bash\n# 进入项目目录\ncd rico-md\n\n# 启动本地静态服务\npython -m http.server 8080\n\n# 访问\n# http:\u002F\u002Flocalhost:8080\n```\n\n也可使用仓库内脚本：\n\n```bash\n.\u002Fstart.sh\n```\n\n## 项目结构（当前）\n\n```text\nrico-md\u002F\n├── index.html\n├── about.html\n├── README.md\n├── LICENSE\n├── start.sh\n├── assets\u002F\n│   ├── images\u002F\n│   │   ├── favicon.png\n│   │   ├── icon.svg\n│   │   ├── logo.png\n│   │   ├── wechat.png\n│   │   ├── wx.jpg\n│   │   └── zanshangma.jpg\n│   ├── scripts\u002F\n│   │   ├── main.js\n│   │   ├── core\u002F\n│   │   │   ├── image-compressor.js\n│   │   │   ├── image-store.js\n│   │   │   ├── markdown-engine.js\n│   │   │   ├── paste-handler.js\n│   │   │   └── render-pipeline.js\n│   │   ├── export\u002F\n│   │   │   └── clipboard-exporter.js\n│   │   ├── storage\u002F\n│   │   │   └── preferences.js\n│   │   └── ui\u002F\n│   │       ├── code-themes.js\n│   │       ├── panel-manager.js\n│   │       ├── theme-manager.js\n│   │       └── toast.js\n│   └── styles\u002F\n│       ├── base.css\n│       ├── editor.css\n│       ├── panel.css\n│       └── themes\u002F\n│           ├── index.js\n│           └── *.js（主题定义）\n└── docs\u002F\n    └── ...\n```\n\n## 兼容性说明\n\n- 这是一个纯前端静态项目，无构建步骤。\n- 需要现代浏览器支持：ES Modules、Clipboard API、Fetch、IndexedDB。\n- 针对公众号复制场景做了结构与样式兼容处理（如代码块与图片复制策略）。\n\n\n### 如何贡献\n1. Fork 本仓库\n2. 创建你的特性分支 (`git checkout -b feature\u002FAmazingFeature`)\n3. 提交你的更改 (`git commit -m 'Add some AmazingFeature'`)\n4. 推送到分支 (`git push origin feature\u002FAmazingFeature`)\n5. 开启一个 Pull Request\n\n### 添加新样式\n1. 在 `styles\u002Fthemes\u002F` 中添加新的主题配置文件\n2. 在 `styles\u002Fthemes\u002Findex.js` 中注册主题\n3. 在 `scripts\u002Fui\u002Ftheme-manager.js` 中将主题归入分类\n4. 确保包含所有必需的元素样式\n5. 测试各种 Markdown 元素的渲染效果\n\n## 作者\n\n**Rico**\n- 个人网站：[https:\u002F\u002Fricoui.com](https:\u002F\u002Fricoui.com)\n- X（推特）：[@ricouii](https:\u002F\u002Fx.com\u002Fricouii)\n- GitHub：[@ricocc](https:\u002F\u002Fgithub.com\u002Fricocc)\n\n\u003Ctable>\n  \u003Ctr>\n    \u003Ctd align=\"center\">\n      \u003Cimg src=\"assets\u002Fimages\u002Fwx.jpg\" width=\"320\" alt=\"公众号：Rico的设计漫想\">\u003Cbr\u002F>\n    \u003C\u002Ftd>\n  \u003C\u002Ftr>\n\u003C\u002Ftable>\n\n\u003Ctable>\n  \u003Ctr>\n    \u003Ctd align=\"center\">\n      \u003Cimg src=\"assets\u002Fimages\u002Fwechat.png\" width=\"160\" alt=\"个人微信\">\u003Cbr>\n      \u003Csub>个人微信\u003C\u002Fsub>\n    \u003C\u002Ftd>\n    \u003Ctd align=\"center\">\n      \u003Cimg src=\"assets\u002Fimages\u002Fzanshangma.jpg\" width=\"160\" alt=\"打赏码\">\u003Cbr>\n      \u003Csub>打赏支持\u003C\u002Fsub>\n    \u003C\u002Ftd>\n  \u003C\u002Ftr>\n\u003C\u002Ftable>\n\n## 开源协议\n\n本项目基于 [MIT License](LICENSE) 开源。\n\n你可以自由地：\n- 商业使用\n- 修改\n- 分发\n- 私有使用\n\n## 致谢\n\n- 感谢原项目 [huasheng_editor](https:\u002F\u002Fgithub.com\u002Falchaincyf\u002Fhuasheng_editor) 的作者花生\n\n\n## Star History\n\n[![Star History Chart](https:\u002F\u002Fapi.star-history.com\u002Fsvg?repos=ricocc\u002Frico-md&type=Date)](https:\u002F\u002Fstar-history.com\u002F#ricocc\u002Frico-md&Date)\n\n---\n\n\u003Cdiv align=\"center\">\n  Made with ❤️ by \u003Ca href=\"https:\u002F\u002Fricoui.com\">Rico\u003C\u002Fa>\n  \u003Cbr>\n  如果觉得有用，请给个 ⭐ Star 支持一下！\n\u003C\u002Fdiv>\n","Rico MD 是一个专为微信公众号设计的纯前端 Markdown 编辑器，支持实时预览、代码块主题、图片本地持久化与一键复制富文本。其核心功能包括左侧编辑右侧预览、多文档管理、自动保存以及丰富的排版主题选择（20套），同时提供了高效的图片处理机制和便捷的导出选项。该工具特别适合需要频繁撰写和排版微信公众号文章的内容创作者使用，能够显著提升写作效率与内容美观度。基于 Vue 3 和其他现代 Web 技术构建，确保了良好的用户体验与兼容性。","2026-06-11 02:51:10","CREATED_QUERY"]