Obsidian 个人插件开发纪实——0x01

背景

年初给自己做年度规划的时候有想过做一些副业（side-projects），同时在使用 Obsidian 的时候发现缺少一些自己期望的 feature，例如可以快捷键或者 slash command 的方式快速打开或者关闭插件，于是就想以开发 Obsidian 插件来尝试自己的副业。

副业纪实会是一个系列的文章，主要是记录我真正从0开始开发一个副业项目的过程：
反思痛点 --> 前期调研 --> 提炼需求 --> 项目设计 --> 架构设计 --> 代码开发 --> 测试发布 --> 回馈社区。主要会记录下这期间我碰到什么问题，怎么解决的，经验总结和积累等等。目前的副业项目主要还是学习和练手，在竞品调研、产品设计、产品力等方面会有不足，这些都还不是目前关注的重点，种一棵树最好的时间是十年前和现在。

Obsidian 插件开发准备

最初我是很犹豫将 Obsidian 插件开发作为副业，主要是技术栈的问题——我熟悉的领域的 infra，像 Obsidian plugin 涉及到的 nodejs、css、React 这些前后端开发对我来讲是完全陌生的，投入的成本会比较高。这件事情就这么搁置了，后来某次午休的时候简单的翻看了一下 Typescript 语法手册，发现比较简单，很多概念跟我已有的技术储备是相通的，这也就大大降低了我的心理负担。

痛点和 idea

痛点

我的 Obsidian vault 除了在 iCloud 上做同步之外，还采用了 obsidian git 插件作为工具备份到 github private repo。由于插件（或者也可能是 Obsidian 本身同步机制的问题），obsidian git 插件打开的时候，我在编辑器里面做文本点击的时候会有经常出现卡顿，主要原因是 simple git freeze Obsidian 类似某些带 gc 的语言（golang、Java）有 stop the world 的性能问题，目前这个问题社区还没有很好的解决办法。

为了 workaround，obsidian git 插件我默认是关闭的，在需要备份的时候我再打开插件进行备份，这个过程每次都需要进入 community plugins 找到 obsidian-git 点击 enable 按钮，然后在通过 backup 命令进行 obsidian vault 的备份问题，这个期间 obsidian 基本上没法做编辑的工作。

idea

每次 enable/disable 某个插件通过快捷键或者 slash command 或者 quickadd macro 进行操作：

• step1，通过 quickadd macro 定制 enable obsidian-git 插件的 macro
• step2，通过 quickadd macro 定制 backup vault 的 macro
• step3，通过 quickadd macro 定制 disable obsidian-git 插件的 macro
• step4，将上述几个 macro 归一并绑定到快捷键
• step5，需要备份的时候直接键盘按下快捷键即可

这个 idea 中 step2 中的 backup vault 目前 obsidian-git 插件已经提供接口（命令）：

step1、step3 目前 obsidian 官方和插件头没有提供相关的能力，URI 也没有相关的接口，目前看来只能通过插件来做了。

PoC 验证

在 Obsidian 调试环境中测试了一下是否有相关的接口来做我想做的事情，如下测试代码：

for (var key in app.plugins.manifests) {
    var id = plugins[key].id
    console.log(id, " enabled status: ", app.plugins.enabledPlugins.has(id))
}
app.plugins.enablePluginAndSave('obsidian-git')
app.plugins.enabledPlugins.has('obsidian-git')

Obsidian 插件开发周边

官方文档

关于 Obsidian 插件开发官方给出了一个  Community plugins Obsidian Help，这里提供了插件开发需要一些东西：

• sample repo: https://github.com/obsidianmd/obsidian-sample-plugin
• API repo: https://github.com/obsidianmd/obsidian-api
• API docs(unofficial): https://marcus.se.net/obsidian-plugin-docs

Obsidian 社区 FAQ

obsidian 运营了一个非常不错的社区，里面有比较多的帮助插件开发的 thread：

• Plugins mini FAQ - FAQ - Obsidian Forum
• Plugin Developmen Help/Initiation - Developers & API - Obsidian Forum
• Just started making plugin - Developers & API - Obsidian Forum

下一步

在正式投入插件的开发设计之前，还有几件事情需要做一下：

1. 补齐自己还不掌握的技术栈；
2. Obsidian plugin UI/UX 调研；

技术栈

下面是插件开发我还需要补全的技术栈：

• javascript
• typescript
• nodejs
• React？

Obsidian 插件 UI/UX 调研

Obsidian 插件涉及到 UI 组件的操作，所以需要调研和确认 Obsidian plugin UI/UX 相关的内容和文档，同时进行必要的 PoC 代码验证。

References

1. Community plugins - Obsidian Help
2. Obsidian Plugin Developer Docs | Obsidian Plugin Developer Docs
3. obsidianmd/obsidian-api
4. 基础类型 - TypeScript 中文手册