在开发插件过程中我最大的收获还是解决问题和拆解任务的提升。从技术上来看其实是没有任何技术含量。但是我自己从中收获了,我就很开心。

遇到的比较大的问题是参考资料较少,当然最主要的问题还是自己太笨。
好在社区开发者多,好在有AI,好在兴趣是最好的老师。

前言

随着人工智能技术的不断发展,越来越多的人开始探索如何利用AI实现自己的想法。我也尝试借助AI的力量,将我的想法转化为实际的产品。在使用思源笔记软件的过程中,一直羡慕社区开发者可以定制自己的工作流,我也一直想开发一些实用且能满足大家需要的插件。之前开发过一些油猴脚本、python脚本。但是做个插件什么的,毕竟是一个系统,比较复杂,初看难以下手。不过我在实际过程中通过不断拆解,不断运用AI给我解释这个是什么东西,最终成功的写出了一款可以使用的插件。

接下来,我将分享这个插件的开发过程以及我在这个过程中的体验。

一、项目背景与构思

思源笔记有200+插件了,好多普遍的需求已被大佬解决了,于是我就从自己的实际需求入手,发现了一个小小小的需求,在打开笔记过程中,经常会产生很多笔记标签页,其实可能只是资料页,可能是过程中的某一页。每次都要自己手动去关闭。

我在想是不是可以自动关闭一下这个标签页,然后在我chrome应用商店中找到了一个类似的插件,于是,我想我应该可以制作一个能够定时关闭标签页插件,插件可以按照规则、按照设置的指定时间自动关闭页面,只保留当前打开页。

大致想法参考此插件Tab Wrangler - 倒计时,自动关闭不常用的标签页[Chrome/Firefox] - 小众软件

后来在和社区开发者交流的时候,我们也聊到: 其实代码方面并不是难度,重要的是想法和idea。

二、先找资料

由于我只有非常基础的编程知识,于是我只能开始找资料,找资料来帮助我拆解整个步骤。

最开始,找到思源开发者提供的官方插件实例:siyuan-note/plugin-sample: SiYuan plugin sample (github.com),但是比较基础,写的不是特别详细。我在考虑怎么办。

我只能说再找其他的,找找到一个社区开发者提供的一个带有框架化的一个模板。但是这两个框架我其实也不会。最后考虑了一下,单独一个框架的我入手应该会快一点,所以最后考虑用考虑用frostime/plugin-sample-vite: SiYuan plugin sample with vite这个框架,我只需要大致掌握vite+ts就够了,而且可以实时编译,自动打包,就它了!

三、开始部署基本的环境

使用AI来写代码已经是非常常见的场景了,这回把VSCode切换成了cursor,cursor比其他家强的地方,它的代码插入是比较插入,可以清晰地看到修改了哪些地方,新旧代码有一个清晰的对比,每个变动都在你check之后再修改。

部署好基本的软件后,我卡在来pnpm i 上……,以为是windows环境下问题,几次重装pnpm和node.js后,最后才发现是镜像mirror的问题,换成镜像后立马解决……哭死,浪费了1天时间。切换淘宝最新镜像源npm-腾讯云开发者社区-腾讯云

又是run dev,又是make_link的,总是就是各种打小怪升级,最后完成了基本环境的搭建。

四、尝试和开发

由于不知道插件的基本逻辑,还是先找资料,几经搜寻。前端 API后端 API插件开发 Quick Start - 链滴这几个文章给了我莫大的帮助。

其中这张图给我了莫大的帮助,结合之前写chrome插件,就知道了其实也就是onload()、onunload()、onunistall()几个主要的函数。剩下就是搭建积木。

在仔细观摩frostime/plugin-sample-vite: SiYuan plugin sample with vite样板项目的代码后,我发现这应该才是最好的示例,各种行动、按钮、设置都有实例可以参考。

分别测试了打开某个指定页面、关闭标签页、定时器几个基本功能。这样大致心里对于整个插件系列有了一些基本了解,开始正式开始撸代码了。

还是按照主程序函数+各个函数的搭配,拆解为几个基本的函数;定时器函数、检查计数函数、处理关闭函数、读取设置参数。把一个个函数的需求、说明和可以参考的实例喂给Claude 3.5 Sonnet。一步步地打架脚手架。拼插积木。

参考其他插件的逻辑,写一些基础的函数积木颗粒,后续做好拼接。

五、功能完善与体验优化

在基础功能完成后,我发现应该增加两个功能,一个是需要按关键词排除;还有一个是笔记软件中有一个今日笔记的功能,最好当天的笔记是不进行自动关闭的。

依旧是把需求喂给Claude 3.5 Sonnet,很快地补齐了这两个功能。

测试两天之后,上架集市。开始修BUG,没有BUG是不太可能的。大致遇到了三个BUG,一个是插件名因为是AI写的,所有在插件代码内有几个文件内的插件名不完全一致导致的BUG、第二BUG是排除关键词是空值时,覆盖了所有,以至于所有标签都不能被关闭。

都是不细心或者对编程细节理解不到位的BUG,好在我最喜欢编码的地方就是可以不断迭代。修完BUG,继续发布新版本。整个插件也日趋成熟。

六、回顾与展望

这个项目的其实整体难度不大,但是时间上超出了我的预期,因为总有层出不穷的小问题需要我来解决,如果以前需要我一直百度,但是现在我可以直接把错误和问题直接扔到AI,不得不说,基本上80%还是可以给出解决方案。

在缺乏开发经验,且不熟悉如何运用编程语言与AI进行交流的情况下,我采取一种拆解的沟通方式——“一步一步来”。首先,可以借助AI产品经理的角色来作为需求的翻译者,或者让AI读取学习其他插件的实现逻辑。这样需求和期望能够被拆解更容易被执行的步骤。随后,利用AI对话,实现具体的代码实现需求。

最近我在记笔记的过程也倾向于以需求出发,落于解决实际的问题,在开发过程中我会一步一步地记录步骤,每个步骤下记录需要解决什么问题、遇到了什么问题,有什么样的参考资料。

通过这个项目,在上线的那一刻我感受到了多巴胺的快乐!感觉自己从不会开发终于写出一个成熟能用的插件。很开心,但是几天之后是较大的失落,因为其实并没有多少人使用你的插件。就算你是一个代码超人,还是需要有人使用你的软件,技术+营销缺一不可。

后续调整心态之后,插件、特别是这种插件首先还是应该面向自己编程,满足自身的需求就行。至于开源分享都是顺带的,如果有人愿意用就用,没有人愿意用就算了。不要过于纠结这个问题。

达成了自己的一小步,能从中获得一定快乐,就足矣。