doocs/md 作为一款开源的 Markdown 编辑排版工具核心功能覆盖了实时预览排版效果、AI 辅助创作、多图床管理以及公众号格式一键适配适配 Windows、macOS、Linux 等主流系统尤其适合自媒体创作者、技术文档编辑和团队内容协作人员使用。它的优势在于将写作、排版、格式转换全流程整合AI 助手能快速润色文字、生成标题公众号格式一键复制功能更是省去了反复调整格式的麻烦极大降低了内容创作的门槛。实际使用 doocs/md 时发现这款工具虽然功能全面但新手刚上手可能需要熟悉下 AI 指令的配置逻辑比如不同大模型的 API 对接需要简单的参数设置不过熟悉后就能快速上手另外图片上传默认的图床设置如果不提前调整可能会影响图片加载速度这点需要稍作留意。仅在局域网内使用 doocs/md 会带来不少不便比如外出时想临时修改文章只能等回到固定设备前操作团队协作时异地同事无法实时查看稿件进度只能通过传文件、开远程控制的方式协作不仅效率低还容易出现版本混乱的问题原本能高效完成的创作流程反而因访问限制拖慢了节奏。而将 doocs/md 与 cpolar 内网穿透结合后这些问题都能迎刃而解。cpolar 能把本地的编辑器映射到公网生成加密的 HTTPS 链接不管是出差在外用手机还是异地同事协作只要打开链接就能实时编辑、预览稿件无需额外配置服务器和域名既保证了访问的安全性又让远程创作和协作变得和本地操作一样顺畅。高效协作、轻松享受的实现方法在下面呦快去实现吧1 项目 doocs/md 介绍开源项目地址https://github.com/doocs/mddoocs/md是一个 GitHub 开源的 Markdown 编辑与排版工具。核心能力实时预览、可定制主题与排版细节字距/行距、代码高亮、公式/流程图、图片上传与多图床、草稿管理与导出。AI 助手润色改写、标题/摘要建议、格式转换等显著降低内容打磨成本。公众号复制支持“复制为公众号格式”将 Markdown 一键适配到公众号后台减少二次排版工作量。适用场景个人与团队写作、技术文档、公众号图文排版与协作审稿。2 安装Nodejs环境2.1 下载Nodejs安装程序官方下载地址https://nodejs.org/zh-cn/download打开Nodejs的官方下载页面选择v20.19.5(LTS)版本进行下载2.2 安装Nodejs程序首先双击执行下载的node-v20.19.5-x64.msi程序然后点击Next接下来勾选I accept the terms in the license agreement同意许可协议继续点击Next进行下一步接着选择安装位置默认该位置即可点击Next进入下一步到自定义设置页面可按需设置直接默认即可点击Next进入下一步接下来到本地模块的工具的界面不用勾选直接点击Next即可最后点击Install进行安装安装完成点击Finish即可2.3 验证Nodejs是否安装电脑按快捷键win R,在弹出的运行框输入cmd点击确定或者回车打开cmd窗口即命令提示符窗口,输入如下命令进行验证nodejs版本# 查看node版本node-v# 查看npm版本npm-v2.4 设置国内淘宝镜像源为了方便项目依赖下载更快建议设置国内镜像源以加速下载在cmd窗口中执行如下命令npmconfigsetregistry https://registry.npmmirror.com/然后输入如下命令进行查看npmconfig list3 下载本地部署doocs/md项目3.1 将项目下载至本地打开开源项目地址然后点击Code展开然后点击Download ZIP按钮进行下载项目地址https://github.com/doocs/md# 如果电脑上有安装git,也可以使用git clone命令将项目克隆下来gitclone https://github.com/doocs/md.git下载步骤可以参考如下图3.2 解压doocs/md项目压缩包下载到本地以后进行解压(这里使用7-zip进行解压推荐使用7-zip解压工具比较好用)# 7-zip官网下载地址https://7-zip.org/download.html解压步骤参考如下图3.3 安装依赖和启动doocs/md项目进入到md-main的项目目录中然后在目录地址栏输入cmd回车即可打开当前项目所在目录的cmd窗口输入如下命令进行项目依赖安装pnpminstall安装完成如下图所示接下来输入如下命令启动该项目pnpmweb dev启动时可能回提示Nodejs应用通过防火墙的警告点击允许访问启动成功控制台如下图所示可以看到控制台输出了多个访问地址以ip为localhost的这一条为例,在浏览器中访问测试http://localhost:5173/md/可以看到成功的访问到了项目4 将网站穿透至公网cpolar穿透篇在安装cpolar前说明一下为什么需要安装cpolar。由于浏览器的安全限制复制公众号格式的功能需要使用 Clipboard API而这个 API 只能在安全上下文HTTPS或本地环境localhost下工作。当我们在局域网或其他网络环境下访问编辑器时由于不是 HTTPS 协议复制功能将无法正常使用。举个具体例子你在本地部署好网站后同事通过局域网IP可以正常访问和编辑但需要复制公众号格式时就会失败因为局域网使用的是HTTP协议而复制功能必须要求HTTPS环境。相比传统的云服务器域名SSL方案cpolar具有零成本启动、配置简单、即开即用等优势特别适合个人开发者、小团队、内容创作者等需要快速搭建可分享编辑器的用户群体无需购买服务器和域名一条命令即可完成内网穿透大大降低了使用门槛。4.1 什么是cpolar?cpolar 是一款内网穿透工具可以将你在局域网内运行的服务如本地 Web 服务器、SSH、远程桌面等通过一条安全加密的中间隧道映射至公网让外部设备无需配置路由器即可访问。广泛支持 Windows、macOS、Linux、树莓派、群晖 NAS 等平台并提供一键安装脚本方便部署。4.2 下载cpolar打开cpolar官网的下载页面点击立即下载 64-bit按钮,下载cpoalr的安装包:下来下来是一个压缩包,解压后执行目录种的应用程序,一路默认安装即可,安装完成后,打开cmd窗口输入如下命令确认安装:cpolar version出现如上版本即代表安装成功!4.3 注册及登录cpolar web ui管理界面4.3.1 注册cpolarcpolar官网访问cpolar官网点击免费注册按钮进行账号注册进入到如下的注册页面进行账号注册4.3.2 访问web ui管理界面注册完成后,在浏览器中输入如下地址访问 web ui管理界面:http://127.0.0.1:9200输入刚才注册好的cpolar账号登录即可进入后台页面:4.4 穿透doocs/md项目的WebUI界面4.4.1 随机域名方式(免费方案)随机域名方式适合预算有限的用户。使用此方式时系统会每隔24 小时左右自动更换一次域名地址。对于长期访问的不太友好但是该方案是免费的如果您有一定的预算可以查看大纲4.4.2的固定域名方式且访问更稳定。点击左侧菜单栏的隧道管理展开进入隧道列表页面页面下默认会有 2 个隧道ssh隧道指向22端口tcp协议website隧道指向8080端口http协议http协议默认会生成2个公网地址一个是http另一个https免去配置ssl证书的繁琐步骤点击website隧道的编辑按钮填写如下信息注意每个用户创建的隧道显示的公网地址都不一样接着点击左侧菜单的状态菜单接着点击在线隧道列表菜单按钮可以看到有2个wechatmd-5173的隧道一个为http协议,另一个为https协议:接下来在浏览器中访问wechatmd-5173隧道生成的公网地址http和https皆可这里以https为例可以看到报错了这个报错说明Vite 的安全策略拦截了请求因为目标域名208ce144.r1.cpolar.top不在允许的访问列表里。接下来需要修改项目中的vite.config.js文件。打开md-main项目目录进入到apps/web目录下找到vite.config.js文件右键打开方式选择记事本进行编辑,操作步骤如下图所示打开后在base,的后面添加如下代码(注意逗号一定要是英文的)server:{allowedHosts:true},添加后参考如下图所示代码保存后访问浏览器进行测试不用重启项目vite会自行构建编译可以发现成功访问到项目啦4.4.2 固定域名方式升级任意套餐皆可在官网升级任意套餐即可获得固定二级子域名推荐升级NasNAS 10M或更高套餐带宽越大加载访问的速度越快。当然预算有限的客户也可以选择基础的套餐皆可支持固定二级子域名功能。好啦接下来开始固定保留二级子域名教程首先进入官网的预留页面选择预留菜单即可看到保留二级子域名项填写其中的地区、名称、描述可不填项然后点击保留按钮操作步骤图如下列表中显示了一条已保留的二级子域名记录地区显示为China Top。二级域名显示为wechatmd。注二级域名是唯一的每个账号都不相同请以自己设置的二级域名保留的为主接着进入侧边菜单栏的隧道管理下的隧道列表可以看到名为wechatmd-5173的隧道点击编辑按钮进入编辑页面修改域名类型为二级子域名然后填写前面配置好的子域名点击更新按钮来到状态菜单下的在线隧道列表可以看到隧道名称为wechatmd-5173的公网地址已经变更为二级子域名固定域名主体及后缀的形式了这里以https协议做访问测试加载稍慢需耐心等待一下:访问成功这样一来你本地部署的doocs/md项目就支持分享给朋友访问啦5 使用doocs/md项目编写公众号文章(实战)经过前面的部署配置现在我们已经成功搭建了一个功能强大的AI加持Markdown编辑器。接下来让我们深入体验这个编辑器的核心功能包括Markdown转公众号格式、AI智能对话、自定义主题等特性看看它是如何让我们的创作效率提升10倍的。5.1 界面布局与基础功能介绍首先介绍一下页面的区域和结构整个编辑器采用经典的三栏布局设计分别为左侧Markdown原生编辑区域这里是我们的主要工作区域支持完整的Markdown语法顶部工具栏包含文件、格式、编辑、样式、帮助等菜单右上角有复制、发布按钮以及设置按钮齿轮图标左侧主体区域的详细图示可以参考如下图中间实时预览区域实时显示Markdown转换后的公众号格式效果所见即所得编辑时立即看到最终效果右边顶部工具导航栏支持复制预览的文章格式主题定制面板等发布暂不可用预览区域内左上角可展开查看大纲和跳转底部状态栏显示文章统计信息字数、字符数、阅读时间中间主体区域的详细图示可以参考如下图右侧主题定制面板点击设置按钮展开包含丰富的个性化选项主题选择经典、优雅、简洁三种风格字体设置无衬线、衬线、等宽字体字号调节从更小到更大的五个级别主题色11种预设颜色 自定义颜色选择代码块主题支持多种代码高亮风格图注格式多种图片说明显示方式预览模式移动端和电脑端白天模式or暗黑模式右侧主体区域的详细图示可以参考如下图截图进行拼接了定制面板一页显示不全暗黑模式效果图参考如下好了主体页面大概就介绍这么多啦具体功能可以自行详细挖掘一下5.2 Markdown转公众号格式首先需要准备一篇Markdown格式的文章然后将其导入至doocs/md项目中(直接复制粘贴到编辑区域也可以)以当前编写的这篇文章为例如下为Markdown的效果图将该文章复制到编辑器中也可以选择左上角文件导入.md的方式导入然后查看其效果图觉得怎么样效果如何是不是很棒接下来我们把转换成公众号格式的预览效果复制起来粘贴到公众号查看效果看看是否和预览的效果一模一样首先点击右上角的复制按钮点击复制:复制下来公众号的格式后打开公众测试平台的公众号发布文章页面,将文章内容粘贴进来查看效果可以发现是不是一模一样等于是你在doocs/md项目中简单调整好主题字体等格式后直接在公众号中设置封面等相关信息就可以直接发布啦效率简直极大提升5.3 AI智能对话与内容生成在完成了“写作—预览—复制发布”的基础流程后本节将把AI真正融入写作我们会打开内置的AI助手面板配置大模型API示范如何用指令一键生成大纲、段落与配图文案并通过“润色/改写/续写/提炼要点”等能力快速打磨内容最终把AI生成的结果无缝落到Markdown中形成可直接预览与发布的成稿。5.3.1 AI助手面板功能介绍首先需要打开AI对话框点击左侧Markdown原生编辑区域的右上角黑色的小按钮点击打开后可以看到如下AI对话框页面5.3.2 配置通义千问大模型首先需要领取千问百万tokens来到阿里云百炼官网点击右上角新用户登录即享每个模型100万免费tokens:阿里云百炼官网https://bailian.console.aliyun.com/#/home领取完成后接下来进入密钥管理设置设置千问api密钥密钥管理https://bailian.console.aliyun.com/?spma2c4g.11186623.0.0.60907980OAftBftabmodel#/api-key点击创建api-key填写完信息然后点击复制按钮复制下来格式大概如下sk-53207f95f7e44ec18d05669767f649b7接下来点击AI对话框中的设置图标按钮进入到AI大模型api配置页面具体操作如下图通义千问-plus模型api地址https://dashscope.aliyuncs.com/compatible-mode/v1/chat/completions5.3.3 配置编写Markdown文章的AI指令为了让通义千问-plus在本项目中发挥最佳效果建议新增一条“自定义指令”用于生成/改写更贴近公众号风格的 Markdown。操作点击 AI 对话框顶部“”新增指令名称建议填入公众号化改写结构化模板粘贴下方内容即可。指令模板你是公众号写作与排版编辑。请把输入内容整理为层次清晰、易读的 Markdown — 标题采用编号结构二级标题用阿拉伯数字如“## 1 …、## 2 …”三级标题按“3.1/3.2/3.3”。 — 仅输出 Markdown 正文简体中文不写解释或前后缀。 — 段落短句化单段≤3行关键点用列表必要时用引用 提示。 — 保留代码块/链接/图片的原始 Markdown不修改 URL。 — 用词简洁、信息密度高避免空话与“AI/免责声明”等无关表述。 若未提供选区内容请基于标题与上下文先给出合理结构与简短导语。 待处理内容 {{sel}}配置好后回到AI对话的首页可以看到添加的指令已经成功显示了点击后下方的对话框中会自动插入指令模板这样一个AI指令就创建好啦5.3.4 使用AI指令进行编写文章在前面小节中已经设置好了AI指令接下来用配置好的AI指令加上我们自己的白话文询问尝试一下写一篇小白入门markdown的教程必须详细相关的语法代码块中演示了还需要显示出效果等点击发送可以看到AI已经按照markdown格式的要求给我们输出了一篇文章内容生成完成后点击复制按钮粘贴到markdown原生编辑区域中查看效果预览可以看到效果是很不错的开头部分语法及效果展示末尾还贴心的加上了误区和技巧以及推荐使用的markdown编辑工具最后让其给我一个适合这篇文章的公众号标题它也是给出了多种风格的标题供我挑选稍微做了一下小的主题格式调整是不是感觉文章就已经挺好看的了怎么样这个doocs/md项目是不是提升了很大的效率6 给doocs/md项目添加访问授权验证在完成公网部署后我们发现doocs/md项目默认无需登录即可访问这在家庭或团队环境中可能存在安全隐患。为了确保只有授权用户才能使用我们的编辑器cpolar提供了便捷的访问授权验证功能。6.1 为什么需要访问授权隐私保护防止他人随意访问你的创作内容资源安全避免AI API密钥被恶意使用访问控制确保只有团队成员或指定人员可以使用成本控制防止API调用量被恶意消耗6.2 配置访问授权验证首先打开cpolar管理界面进入隧道管理→隧道列表找到wechatmd-5173隧道点击编辑按钮在编辑页面中点击高级按钮展开高级配置选项按照下图进行设置在HttpAuth这一栏输入admin:123456 其中【admin】为你想要设置的账号中间的冒号是英文的不是中文【123456】为想要给admin用户设置的密码6.3 验证授权效果重新访问你的公网地址会发现浏览器弹出登录验证框输入刚才设置的用户名和密码即可正常访问编辑器。这样你的doocs/md项目就具备了基础的安全防护既保持了便捷的远程访问能力又确保了内容与资源的安全。总结doocs/md 的高效创作能力搭配 cpolar 的远程访问优势让内容创作不再受限于设备和网络环境。从本地编辑到公网协作整个流程简单易操作既能专注内容创作本身又能兼顾团队协作效率是创作者提升产出效率的实用组合。感谢您阅读本篇文章有任何问题欢迎留言交流。