我如何撰写博客

曾几何时，当我还是一个技术小白的时候，我使用WordPress写博客。后来为了炫酷和DIY，我跑去了GravCMS。它们作为成熟的博客平台有一个共同的特点，就是都内置了完善的文章编辑器，写文章是一件非常一条龙、丝滑的事情。然而，自从我把博客系统更换为完全自制的 CMS 之后，写作的流程就发生了根本性的变化——我没有编写后台管理界面！这意味着我所有的 Markdown文章都需要在外部环境中编辑完成，然后再发布到服务器上。

我目前最常规的写作工作流是这样的：在本地电脑上打开Typora撰写内容，完成之后，再通过Filebrowser或者WebDAV协议将 Markdown 文件上传到服务器。这套流程在坐在 Windows 电脑前时很流畅，但它的局限性也很明显——我被Windows卡脖子了！我常常希望在一个脱离桌面环境的场景下也能随时随地编写博客。比如，在晚上睡觉前躺在床上时，脑子里突然闪过什么超级棒的主题，我希望能立刻把它完整地写下来保存，而不是要飞奔到电脑桌前开机敲键盘。

有了在非Windows环境下码字的需求，我开始进行方案考察。我先在App Store逛了一圈，调研iOS平台上的各种 Markdown编辑器。应用的数量数量繁多，但很多都不支持所见即所得的实时渲染，或者根本不支持通过 WebDAV 直接将文件保存到我的服务器。那些功能相对完善、支持这些特性的软件，往往又价格上非常可怕。如果是一个价格合理的买断制，姑且会觉得还行，但现在大多流行订阅制，这就显得有些太过了。生态封闭、过度商业化的结果就是这样呀~ 为了一个并非每天都会发生、相对不确定的灵感记录需求去长期付费，显然不是一笔划算的投入。

对我来说，所见即所得在撰写博客的过程中非常必要。不同于记笔记，写文章时大脑是在实时思考、输出文字流的。如果输入的流畅性被打断，不能专注地只打必要的文字，像是不得不多打一个空行，会让思路很容易被打断，文章写起来会加倍痛苦。

既然移动端原生App这条路走不通，我的思路自然而然来到了Web编辑器。抛开webkit很垃圾这一点不谈，只要有个浏览器就能随时访问并使用还是很方便的。我用来管理文件的Filebrowser本身就自带了一个Ace Editor。但问题在于，Ace Editor的定位主要是一个代码和纯文本编辑器，界面不太好看。更致命的是它不支持 Markdown 的实时渲染。为了改善这一点，我曾尝试手动去修改Ace Editor的CSS样式，让它看起来像个文档界面。结果不仅没能把它调整到满意的状态，反而因为样式冲突导致界面显示出了各种Bug，最后只能作罢。

面对现成工具的种种硬伤，我萌生了一个蠢蠢欲动、但是又让我很想扇自己的想法：要不从零开始自己写一个吧！于是，我用Go+Vue，vibecoding了一下，很快就拼凑出了一个初版的包含文章编辑器功能的后台管理系统，内置一个纯文本编辑器和 Vditor。然而，自己硬写出来的系统确实存在诸多不足。虽然基础功能可以使用，但整体的交互体验只能说非常一般，有大量细节需要打磨。仔细评估了一下，如果要把这个半成品一版一版地迭代优化到好用的程度，需要耗费极大的心智和精力，并不值得。又菜又爱造轮子是不可取的！这个自制后台最终只能暂时搁置作为备用，而不是生产主力。

Vditor是国人编写的web markdown editor。使用起来非常流畅，界面很符合国人的习惯。~~美中不足的一点是看起来太像知乎了。~~个人觉得如果是纯写博客的话，它的一些功能会有点多余。

兜兜转转，我决定重拾Filebrowser，下载它的源码然后DIY。我觉得Vditor是一款很棒的编辑器，但我觉得它的风格不太适合我。在个人美学上，我更喜欢极简的Milkdown，而且它的名字很可爱。因此，我决定让Filebrowser在打开.md文件时，默认加载Milkdown编辑器。

决定了编辑器之后，真正的技术挑战才刚刚开始。无论我怎么尝试，Milkdown 就是无法正确地初始化。经过了排查和调查，最后发现问题的根源在于初始化的时候缺失了某些关键值的传递。由于我对前端的了解很低，这种棘手的生命周期问题最终完全丢给了LLM来解决。事情大概是这样的：

在 Vue 3 的生命周期中，由于 Filebrowser 的 Editor.vue 组件获取文件内容采用的是异步请求的形式，导致 Milkdown 实例挂载时接收到的仅仅是一个初始的空字符串，而且并没有对属性值的变更绑定有效的监听。为了修复这个初始化不同步的问题，我将文件内容的获取逻辑以及编辑器的初始化过程，全部提升到了 Vue 的 setup 声明作用域内，终于解决了数据同步的 Bug。

解决了编辑器嵌入问题后，可能迟到但是永不缺席的就是经典的前端兼容性问题。由于我最初的设想就是为了能在手机上便捷写作，因此必须单独为移动端的屏幕尺寸和交互重新修复和调整各种样式。这真的是一个极其繁琐且让人烦躁的环节，但经过这一系列的折腾，一套完全符合自己审美、支持跨设备随时写作的博客编辑流终于算是构建完成了。耶！