还在用 Cursor？免费用 Trae 打造贪吃蛇游戏

tmpn8ryxp0f.png

一、下载与安装

第一步，当然是下载安装 Trae。这一步很简单，就像平常安装其他软件一样，从官网获取安装包后，按照提示一步步操作即可。

tmpcgwijynw.png

二、欢迎界面与主题配置

安装完成后，打开 Trae，首先映入眼帘的是欢迎界面，它就像一个热情的向导，引导你开启代码之旅。

tmp5_

接着，你可以根据自己的喜好配置主题，亮色主题适合白天，暗色主题则在夜间更护眼，让你的代码编辑环境更加舒适。

tmpdg8ug9pr.png

三、跳过配置导入，登录账号

这时，Trae 会询问是否需要导入之前 VS Code、Cursor 的配置，我们先跳过这一步，直接进入后续操作。

tmpasktq8mq.png

然后，需要使用 Github 授权登录，这样才能充分使用 Trae 的各项功能。

tmpcyfjv9ys.png

四、熟悉默认界面，选择 Builder

登录成功后，我们看到的是软件的默认界面，简洁明了，各个功能区域一目了然。

tmpxkcc732a.png

因为我们要使用自动编写代码功能，所以选择 Builder。Builder 提供了两个默认示例，方便我们快速上手。

tmpg5ajf_ia.png

五、生成贪吃蛇游戏项目

我选择生成贪吃蛇游戏，结果 AI 提示我没有打开存放游戏的文件夹。

tmp_

于是，我新建了一个 Greedy-Snake 目录，贪吃蛇游戏将在这个目录下创建。

tmpr66353zz.png

接着，AI 开始工作，它自动选定了合适的语言和框架，并开始初始化项目。

tmpa990ov1y.png

AI 生成的文件，需要用户点击接受才能保存到目录中，这是为了确保我们对生成的代码有控制权。

tmp8q2ricjb.png

很快，一个 Node.js 项目就生成好了，目录下的文件结构也随之呈现。在整个过程中，我们只需根据 AI 的提示进行操作，非常简单。

tmp9yvyy69n.png

六、运行游戏及功能优化

最后，我们来运行游戏，看看效果如何。结果发现游戏速度太快，我这手速根本跟不上，很快就 “Game Over” 了，不过游戏结束弹框倒是正常出现。

tmpx2gyibf1.png

速度太快了，很快就GG了，游戏结束弹框也有

tmptl7j0nss.png

而且，游戏是一运行就开始，这和我的预期不太一样。我希望有一个开始游戏弹框，点击后游戏才开始。于是，我提交了这个想法，看看 AI 怎么处理。

tmpoiu4oyh7.png

AI 很快给出了修改后的版本，效果是实现了，但是又出现了新问题：每次点击开始游戏，游戏开始后界面上又会显示开始游戏弹框。

tmpihpw1gg5.png

没关系，再次和 AI 沟通，这次它终于理解了我的需求，完美实现了我的要求。

tmpor7uoe_

这就是最终的效果，是不是很棒？

tmpsxyyxuj8.png

最后，看看项目的目录结构，清晰明了。

tmpk_