您好,我是程序员夏叶,深度AI编程使用者,专注于分享AI编程方面的使用技巧和经验,有兴趣的可以关注我的公众号,一起学习,共同进步。
今天来说一说,怎么用trae开发一个trae插件。
一、Trae插件是什么
说到trae插件,首先要知道trae的插件本质上是什么,现在大家经常拿cursor和trae这两个AI编程IDE做比较,说白了,他们都是一个性质,都是拿vscode作为基线,然后进行了自己的改造,所以对于插件支持,其实他们与vscode是一样的,不同的是,cursor用的是vscode官方插件市场(应该不是直连),可以直接下载安装vscode官方插件市场的插件,而trae不一样,它的插件源直连的是Open VSX
这个开源的插件市场,是不能直接安装vscode官方插件市场的插件的,需要手动安装才行。
那么Open VSX
是个什么性质的网站,我直接让deepseek帮我总结了一下,它总结的很到位,如下: Open VSX是由Eclipse基金会维护的开源插件市场,可理解为VSCode插件的'开源版应用商店',其诞生背景是解决微软 VS Code
扩展市场的访问限制,并推动开发者生态的开放协作。
说白了,Open VSX
是一个开源的插件平台,所有把插件发布到Open VSX
这个插件市场的开发者都属于为爱发电,它是没有收费接口的,而开发trae插件就等于开发Open VSX
插件,所以说,你如果是冲着能赚钱的目的想开发trae插件,那你属于来错地方了,有好的点子,可以直接开发vscode官方插件,发布到vscode官方市场去。
说到这里,讲句题外话,笔者之前也为爱发电过一次,写了一个Trae插件VSPlugin Helper
,它可以自动帮我们把vscode官方插件市场的插件安装到Trae本地或者SSH连接的远程机器上,有需要的可以试一下,具体使用方法在这里:
别再手动搬运插件了!用VSPlugin Helper一键穿透SSH,让Trae远程开发秒接VSCode生态
二、怎么用Trae开发一个Trae插件
首先新建一个名为code-chg的空项目,然后再Trae的build模式下,给它一段提示语,如下:
- 这是一个Trae插件,也就是需要发布到Open vsx的插件,前端使用TypeScript来开发,构建工具使用esbuild
- 这个插件主要功能是根据我提前设置好的规则,能自动帮我批量修改c++源文件中的代码
- 插件需要增加设置项,这个设置项可以设置某些特定的函数,举一个例子,比如设定sprintf,那么当使用这个规则的时候,就自动帮我把指定范围内的sprintf改为snprintf的形式
- 使用插件时可以指定某段代码,或者某个函数,然后来应用提前设定好的规则进行批量代码修改
- 需要说明怎么对项目进行构建、调试和打包
接着Trae就自动生成了整个的项目框架和实现代码,过程如下:
从图片中可以看到,它生成的各个文件具体起什么作用AI都做了说明,看起来一目了然,另外有自己想使用的语言和构建工具一定要显式的说明,不然Trae就会随机的使用了。
生成的整体项目结构如下:
这其中有一个重要的文件就是README.md
,这里面说明了怎么构建和使用这个插件。
这时候就可以对项目进行构建和调试了,使用npm run build
来进行构建,开发阶段可以先试用npm run watch
来进行调试,这里我们在终端输入命令npm run watch
,如下:
npm run watch
用于开发阶段,它会持续监视源代码文件的变化,当文件发生修改时自动重新编译,接下来使用F5来启动调试,Trae会重新打开一个专门的调试窗口,然后按照README.md
中的说明,来对插件进行调试即可。
接下来就是不断的对插件进行调试,发现有错误的直接在build模式下反馈给AI,它会帮你修改,直到插件可用为止。
三、发布Trae插件到Open VSX Registry
当我们认为插件没有问题以后,就需要发布了,怎么发布呢,不用太过头疼,直接问AI就对了,如下:
AI直接帮我们生成了相应的发布脚本publish.js,接下来按照如下流程来获取 Open VSX Registry 的访问令牌:
- 访问 https://open-vsx.org
- 注册/登录账号
- 创建命名空间
- 在个人设置中创建访问令牌,注意在创建访问令牌时还需要注册一次Eclipse网站并登录
具体网站怎么操作,这里就不展开说明了,跟着网站注册登录过程提示走就行了。
注意在这个过程中有两个关键点:
- 第一是命名空间,要把创建好的命名空间更新到
package.json
文件里面的publisher字段中; - 第二是token--访问令牌,要把获取到的访问令牌复制到上图中AI帮忙生成的
.tokens.json
文件中。
然后运行npm run publish
来进行自动打包和发布即可。
注意:因为AI生成的不确定性,你的token文件不一定是.tokens.json
文件,但是无论放在哪里,要仔细看AI的说明,它会告诉你放在哪里。
这里我因为之前已经注册过open vsx
的网站,现在我直接生成一个新的token,复制到.tokens.json
文件,然后直接运行npm run publish
,中间可能会存在一些报错,把报错信息复制给AI修正即可。
最终打包结果如下:
接下来去查看Open VSX Registry
,可以看到后台已经有刚刚发布的插件了,如下:
这时候到Trae的插件市场去搜索,可以看到我们刚刚发布的插进已经可以搜索到了,如下:
四、使用插件
接下来其他开发者就可以安装和使用了,不得不说AI是真的强大,我试了一下,它居然真的可以用了,中间我就调整了一次,感兴趣的可以试用一下看看。
使用方法如下:
- 首先在Trae中安装
Code Change Assistant
- 配置替换规则
-
规则名称
-
源函数名
-
目标函数名
-
通过命令面板(Ctrl+Shift+P)运行 "Configure Code Change Rules"
-
在设置中添加新的替换规则,包括:
- 应用规则
- 选择要修改的代码范围(可选)
- 通过命令面板运行 "Apply Code Change Rule"
- 从列表中选择要应用的规则
这里面配置规则是会跳转到setting.json文件中,配置格式如下:
"code-chg.rules": [
{
"name": "sprintf转snprintf",
"sourceFunction": "sprintf",
"targetFunction": "snprintf"
}
]
使用效果如下所示:
当然插件本身目前只是实现了基本功能,后续有时间我再完善下,公司项目中诸多函数不规范的地方,会被代码扫描扫出来,以前一个一个的改,有了这个,可以实现批量修改了。
好了,今天就说到这里了,如果对你有所启发,欢迎一键三连。
有关trae的一些其他使用技巧,欢迎关注公众号后,在菜单栏获取。