一、软件简介与安装配置
1. 核心特点
Trae CN 是字节跳动推出的免费 AI 原生 IDE，基于 VS Code 内核开发，深度集成大模型编程能力，主打中文友好、零门槛上手，核心优势包括：
- 全中文界面与本土化适配，支持国内主流技术栈
- AI 驱动的代码生成、补全、修复等全流程辅助
- 无缝迁移 VS Code/Cursor 配置，开发习惯零成本切换
- 支持 Windows/macOS 系统，Linux 版本可预约获取
2. 安装步骤
- 下载安装包：访问Trae 中国官网，根据系统选择对应版本
- 初始配置（首次启动）：
-
- 选择主题（暗色 / 亮色 / 深蓝）和显示语言（默认简体中文）
-
- 可选：一键导入 VS Code/Cursor 的插件、主题和快捷键配置
-
- 安装命令行工具：点击「安装trae命令」，后续可通过终端快速唤起 IDE
-
- 登录认证：使用手机号或稀土掘金账号登录（需登录才能使用 AI 功能）
二、界面快速导航
Trae 界面分为五大核心区域，布局清晰直观：
- 顶部菜单栏：文件操作、编辑、视图等常规功能
- 左侧区域：
-
- 文件资源管理器：管理项目文件 / 文件夹
-
- 搜索栏：全局文件 / 代码内容检索
-
- 功能按钮：源代码管理、Web 预览、调试器、插件市场
- 右侧 AI 工作区：核心功能区，支持 Chat 对话和 Builder 项目生成
- 底部区域：终端命令行、错误提示、状态栏
三、基础操作指南
1. 项目管理
- 新建项目：「文件」→「新建项目」，可选择空白项目或通过 Builder 模式生成
- 打开项目：「文件」→「打开文件夹」，或终端执行 trae 项目路径
- 新建文件：右键文件夹→「新建文件」，支持自动识别文件类型并生成模板
2. 常用快捷键（分系统）
|-------------|--------------|-----------------|
| 操作 | Windows 快捷键 | macOS 快捷键 |
| 新建文件 | Ctrl+N | Command+N |
| 唤起 AI 侧边对话框 | Ctrl+U | Command+U |
| 代码自动补全 | Ctrl+Space | Command+Space |
| 打开命令面板 | Ctrl+Shift+P | Command+Shift+P |
| 全局搜索 | Ctrl+Shift+F | Command+Shift+F |
| 注释代码行 | Ctrl+/ | Command+/ |
| 跳转到定义 | Ctrl+F12 | Command+F12 |
| 重命名变量 / 函数 | F2 | F2 |
自定义快捷键：「设置」→「通用」→「偏好设置」→「快捷键设置」，支持修改 / 添加 / 删除组合键
四、核心 AI 功能详解
1. Builder 模式：自然语言生成完整项目
适合从零搭建项目，无需关注技术细节：
- 点击右侧「Builder」标签
- 用中文描述需求（例：「做个春节接福小游戏，支持拖拽福字到指定区域」）
- 系统自动拆解任务、配置环境、生成可运行代码（10 分钟内完成基础搭建）
- 生成后可直接在编辑器中修改优化
2. 智能代码补全
两种补全模式，提升编码效率：
- 基础补全：换行或添加注释后自动触发，按Tab采纳全部推荐，Ctrl+→逐字添加，Esc取消
- Pro 补全（默认启用）：光标定位后按Ctrl+Shift+Enter主动触发，采纳后自动推荐下一个改动点
- 特性：跨文件感知上下文，自动匹配项目内接口定义和参数格式
3. 代码生成与编辑
- 自然语言生成代码：
-
- Ctrl+U 唤起 AI 对话框
-
- 输入需求描述（例：「生成一个 Vue3 的登录表单组件，带手机号校验」）
-
- 点击「发送」，生成后可选择「复制 / 插入 / 新建文件 / Apply（Diff 预览）」
- 代码编辑 / 优化：
-
- 选中目标代码
-
- 输入指令（例：「优化这段代码的性能」或/fix修复错误）
-
- 系统返回修改后的代码，支持对比采纳
4. 实用 AI 工具集
|--------|----------------------------------|---------------------|
| 功能 | 触发方式 | 用途 |
| 代码解释 | 选中代码→右键「Trae AI→代码解释」或输入/explain | 理解复杂代码逻辑 |
| 单元测试生成 | 选中代码→输入/test或右键对应选项 | 自动生成测试用例 |
| 注释生成 | 选中代码→输入/doc或右键对应选项 | 生成函数级 / 行间注释 |
| 智能修复 | 代码报错时选中→输入「修复这段代码」或/fix | 定位并修复语法 / 逻辑错误 |
| 图像转代码 | 点击「导入」→「上传图片」 | UI 截图生成 HTML/CSS 代码 |
5. Chat 模式：实时解决编码问题
调试排错时高效求助：
- 点击右侧「Chat」标签
- 输入问题（例：「为什么这个 API 请求返回 404」），可加#关联当前文件上下文
- 系统结合代码结构和语法规则给出解决方案，支持多轮追问
- 特性：基于 Claude-3.5-Sonnet 引擎，理解中文技术问题更精准
五、插件与环境配置
1. 插件安装
- 方式 1：直接在 Trae 插件市场搜索安装
- 方式 2：导入 VS Code 插件
-
- 从VS Code 市场下载.vsix 文件
-
- 打开 Trae 插件市场，拖拽文件至面板完成安装
2. 环境迁移
- 首次启动时自动识别本地 VS Code/Cursor 配置
- 手动导入：「文件」→「导入配置」→选择对应 IDE 的配置目录
- 支持迁移：ESLint 规则、主题、代码片段、已安装插件
3. 多模型切换
默认集成豆包、Claude-3.5-Sonnet、GPT-4o：
- 点击 AI 对话框右上角「设置」
- 在「Trae AI 设置」中选择默认模型
- 建议：算法优化用 GPT-4o，业务代码用豆包（中文支持更好）
六、Webview 实时预览（前端开发专属）
- 开发 React/Vue 等前端项目时，点击左侧「Web 预览」按钮
- 右侧将显示实时渲染效果，修改代码后 300ms 内自动更新
- 支持交互事件响应，可直接在预览区测试按钮点击、表单输入等操作
七、常见问题排查
- AI 功能无法使用：检查是否已登录账号，网络是否正常
- 导入配置失败：确认原 IDE 路径正确，关闭其他 IDE 后重试
- 快捷键冲突：进入快捷键设置页面，搜索冲突按键并修改
- 代码补全不生效：检查「Trae AI 设置」中是否启用补全功能，重启 IDE 尝试