Vibe Coding 一天内完成图片编辑工具（Trae 又行了？

最近一段时间高强度使用 Cursor、Kiro、Trae 这三大编辑器。

最开始用 Cursor， 用的 fake cursor 插件，只嫖一个免费版（ claude 3.5 ）。 一用真香啊，能设置 rules，不跑题，交互也丝滑。

然而用的多了，没两天时间，感觉就不守规矩了。rules 要么就是漏下，要不就完全不遵守了。感觉是要从我手下离职，要报复我一样...🥲

自动从聊天中中总结一些临时规则虽然不错，但换了电脑好像就没了，隔一段时间好像也会自动没（？）。

这时候开始出现一些 Kiro 的宣传文章，我正好有用，就火速下载体验。

谁让他能用 Claude4 呢

体验一番后，感觉他的设计思路很不错，尤其是 Spec 模式。但我还是 Vibe 模式用的多。

也可能是 Claude4 的加持效果太好，从 3.5 到 4，像是从村里进城一样，哪哪都是好啊...

唯一的问题可能在我

这种可能是网络问题导致重试情景时常出现。

而且思考时间要比 cursor 和 trae 长很多。

由于思考时间长（可能是上下文多），还会出现死循环，不停的在解决同一个问题。

但是总体还是帮我干了很多活，准确度非常高

（但两天就被我把额度干没了）

比如我这个只用了一天时间就做出来的图片编辑工具

https://zzao.club/imgx

右键出现操作面板，支持无限分割格子

也可以分割后再把格子删掉。删掉后又可以让格子补齐它的空位。

也可以设置圆角、间距。

同时也支持直接粘贴刚刚复制的图片。

理论上可以出现任何布局

没有图片的格子就会被绘制成透明背景。

而分图功能，可以将上传的图片，分布到每个格子中。

也支持再次拆分格子，再次上传图片

如果再次切换回拼图模式，就可以再次重新给小格子上传图片

当然，再次切换到分图，就会重新把新上传的图片重新分割。

然后就是一个简单的长图功能。支持横向和纵向。

可以选完再上传图片，也支持传完再切换比例。

以上就是全部功能了（目前纯前端功能），总体用时在 8 小时以内，具体几个小时记不清了，因为我是每天写一部分。

比较关键的点就是： 要先定一个总体的架构，不管是自己写，还是让 AI 自己写，先把基本思路完全敲定。

比如我这个图片工具，核心就是维护一组数组数据，页面渲染完全依靠这组数据，调整参数就是调整数据。导出也是用数据在原生 Canvas 上重绘完全一致的页面，然后导出。

这样不管是分割格子，还是上传图片，分割图片，长图，本质都是处理这组数据。扩展性还是很高的，就算完全转为后端渲染也很轻松支持。

如果是采用了依靠 html 渲染内容，在使用 html2canvas 导出 html 内容。一是把场景限制在了浏览器上，二是需要特殊处理元素上的交互，避免导出不需要渲染的元素、辅助线等。

至于为什么做这种图片工具。

这算是我在 25 年 2 月份构思的图片工具的一部分。

一开始先做的第一部分（ IMG ），也就是文字生图片，还在 V2EX 发了贴 原贴

很快就 100 多 star 了。

但可能大部分只是有兴趣，提出问题的人很少，所以我在迭代完所有内容，并且经历了一次比较大的重构。目前支持自定义模板，自定义预设，然后使用一个预设码去拿到自己想要的图片。

https://imgx.zzao.club/008/default 比如这个链接

https://imgx.zzao.club/008/随意更改标题/对对对/和副标题/菜鸟

也支持直接触发下载，点开链接即可保存图片 （不过微信了不让你打开下载，会提示去浏览器

https://imgx.zzao.club/008/default?download=1

当初这个功能，吭哧吭哧做了一两个月，那时候我还是古法敲制的代码...

而图片处理这部分，一天不到就用 AI 搞完了

用 Kiro 完成了拼图和分图功能后，我正在头疼没额度了怎么办

突然 Trae 给我自动续费了。。。

此时我还在心里咒骂 Trae

本着钱都花了就试试吧的想法打开了 Trae

然后惊喜的发现它更新了 2.0 了！

并且也能和 Cursor 一样设置 .trae/rules/project_rules.md ，以前没注意它能不能设置上下文，现在才发现能设置项目的上下文，也能导入更多的上下文。

但这个 rules 仅仅就是放在这里，供它使用，你在对话中让他去操作这个 rules，自己写入，他完全不理解往哪里写，说明对话模式里没设计和 rules 的交互。

但是我也比较满意了

毕竟这么多可以用的模型，2 天内也没发现网络错误之类的问题，很稳定。

而且我只是让他不要跑出我的把控，所以有 rules 之后输出的代码就很稳定。

然后我就继续用 Trae 完成了长图功能。

非常坎坷，需求太细致了，反而不利于 AI 发挥。

但是你让它完全自由发挥，十分不可控，扩展性也比较差。正常的扩展性指的是方便支持更复杂的功能，毕竟以前需要手写。

现在对于 AI 来说，什么扩展性不扩展性的，就算重写整个项目都用不了太长时间。。

另外，SOLO 模式用不了，没码！

在我畅快的使用 Trae 时，前线又传来了 Cursor 封锁中国 IP 的消息！

突然，此刻的 Trae 显得格外好用....

根本不认识什么 cursor 和 kiro ！