怎么用trae开发一个trae插件,看这篇就够了

大模型向量数据库机器学习

您好,我是程序员夏叶,深度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就自动生成了整个的项目框架和实现代码,过程如下:picture.image

从图片中可以看到,它生成的各个文件具体起什么作用AI都做了说明,看起来一目了然,另外有自己想使用的语言和构建工具一定要显式的说明,不然Trae就会随机的使用了。

生成的整体项目结构如下:picture.image

这其中有一个重要的文件就是README.md,这里面说明了怎么构建和使用这个插件。

这时候就可以对项目进行构建和调试了,使用npm run build来进行构建,开发阶段可以先试用npm run watch来进行调试,这里我们在终端输入命令npm run watch,如下:picture.image

npm run watch用于开发阶段,它会持续监视源代码文件的变化,当文件发生修改时自动重新编译,接下来使用F5来启动调试,Trae会重新打开一个专门的调试窗口,然后按照README.md中的说明,来对插件进行调试即可。

接下来就是不断的对插件进行调试,发现有错误的直接在build模式下反馈给AI,它会帮你修改,直到插件可用为止。

三、发布Trae插件到Open VSX Registry

当我们认为插件没有问题以后,就需要发布了,怎么发布呢,不用太过头疼,直接问AI就对了,如下:picture.image

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修正即可。

最终打包结果如下:picture.image

接下来去查看Open VSX Registry,可以看到后台已经有刚刚发布的插件了,如下:picture.image

这时候到Trae的插件市场去搜索,可以看到我们刚刚发布的插进已经可以搜索到了,如下:picture.image

四、使用插件

接下来其他开发者就可以安装和使用了,不得不说AI是真的强大,我试了一下,它居然真的可以用了,中间我就调整了一次,感兴趣的可以试用一下看看。

使用方法如下:

  1. 首先在Trae中安装 Code Change Assistant
  2. 配置替换规则
  • 规则名称

  • 源函数名

  • 目标函数名

  • 通过命令面板(Ctrl+Shift+P)运行 "Configure Code Change Rules"

  • 在设置中添加新的替换规则,包括:

  • 应用规则
  • 选择要修改的代码范围(可选)
  • 通过命令面板运行 "Apply Code Change Rule"
  • 从列表中选择要应用的规则

这里面配置规则是会跳转到setting.json文件中,配置格式如下:

  
"code-chg.rules": [  
    {  
    "name": "sprintf转snprintf",  
    "sourceFunction": "sprintf",  
    "targetFunction": "snprintf"  
    }  
]  

使用效果如下所示:picture.image

当然插件本身目前只是实现了基本功能,后续有时间我再完善下,公司项目中诸多函数不规范的地方,会被代码扫描扫出来,以前一个一个的改,有了这个,可以实现批量修改了。

好了,今天就说到这里了,如果对你有所启发,欢迎一键三连。

有关trae的一些其他使用技巧,欢迎关注公众号后,在菜单栏获取。

0
0
0
0
关于作者
关于作者

文章

0

获赞

0

收藏

0

相关资源
CV 技术在视频创作中的应用
本次演讲将介绍在拍摄、编辑等场景,我们如何利用 AI 技术赋能创作者;以及基于这些场景,字节跳动积累的领先技术能力。
相关产品
评论
未登录
看完啦,登录分享一下感受吧~
暂无评论