AI编码：使用Trae

SunACong
1,038 阅读3分钟

我正在参加 Trae AI 编码从入门到实践线上共学第一期，Trae 免费下载链接： www.trae.ai

ok~朋友们！前一篇文章咱们简单了解： AI编码：了解Trae

  1. Trae到底是什么？
  2. 相比于AI扩展有什么区别？
  3. 以及Trae的几种模式

今天给大家介绍一下如何使用Trae，今天我们将对Trae的界面进行分模块使用进行功能指南。

Trae界面

  1. 左侧工具栏：可以查看项目文件、全局搜索、git操作、预览项目、调试模式以及插件市场（老生常谈了，熟悉VSCODE的朋友，应该不陌生）
  2. 左侧工作区：项目文件区域
  3. 中间代码编辑区：主要的代码编辑区，编写代码时可以按 Ctrl+i 唤起AI交互
  4. 中间终端区域：执行终端命令（支持选中终端区域为上下文去和AI交互哦~）
  5. 右侧AI交互区：支持chat 和 builder两种模式

目前使用Trae需要挂在梯子后登录使用，使用的模型也只能选择Claude-3.5-Sonnet

image.png

核心功能

1️⃣ 静默辅助能力——编码补全

  • 代码补全的功能是深度定制的IDE自带的静默能力，无需刻意唤醒

自动补全

tab键可以接受补全建议，不满意的话可以会退一个字符再加上即可重新生成补全意见哦~

2️⃣ AI编码即时响应

与传统插件的问答不同，Trae具有分析用户问题的意图，Trae会有不同的策略选取差异化的上下文信息用于检索增强，进而达到即使用户上下文信息不完整仍然可以高精准度答复的效果。

  • Trae通过建立项目代码索引管理来增加自己的理解能力，具体设置:右上角小人-设置-通用-Trae AI-代码索引管理）

如果你觉得AI的理解能力变差时可以重新建立对项目代码的索引来改善

  • 即时响应状态下，AI会对你的项目文件进行上下文分析，给出代码修改意见，同时你可以在对话框内选择是否接受AI给出的建议（目前还不支持逐行接受代码变更）
  • 支持上传图片进行提示和引导AI对网页的信息解析
  • 支持编辑器以及终端复制到对话框进行上下文提示交互（再也不会因为莫名其妙的报错，而去搜索一个甚至几个小时啦~）

image.png

3️⃣ 其他功能

  • 图像转代码：直接上传UI设计图或错误截图，AI解析后生成对应代码或解决方案
  • Webview实时预览：前端开发无需切换浏览器，IDE内直接调试网页效果
  • 原生中文界面与代码注释，深度适配中文编程习惯：
  • 配置无缝迁移：支持从VSCode/Cursor导入插件、快捷键等个性化设置

下一章我将为朋友们展示Trae的编码能力，从0-1搭建自己的组件库项目，并实现静态说明文档的发布教程

感兴趣的朋友可以点上订阅哦~

avatar
文章
阅读
粉丝