Trae AI IDE

Trae（/tre?/）與 AI 深度集成，提供智能問答、代碼自動補全以及基于 Agent 的 AI 自動編程能力。使用 Trae 開發項目時，你可以與 AI 靈活協作，提升開發效率。

完備的 IDE 功能

提供傳統的 IDE 功能，包括代碼編寫、項目管理、插件管理、源代碼管理等。

強大的 AI 助手

智能問答
在編寫代碼時，你可以隨時與 AI 助手對話，獲得代碼解釋、代碼注釋和錯誤修復等幫助。詳情參考《側邊對話》和《內嵌對話》。
實時代碼建議
AI 助手能夠理解當前代碼并在編輯器中實時提供代碼建議，提升編程效率。詳情參考《代碼自動補全》。
代碼片段生成
通過自然語言描述你的需求，AI 助手將生成相應的代碼片段，甚至能夠編寫項目級或跨文件的代碼。
從 0 到 1 開發項目
告訴 AI 助手你想開發的程序，AI 助手將根據你的描述提供相關代碼或自動創建所需文件。詳情參考《Builder 模式》。

安裝 Trae 并完成初始設置

本文檔介紹如何安裝 Trae 并完成基礎配置。

第一步：安裝并啟動 Trae

1. 前往 Trae 官網，將 Trae 安裝至電腦。

2. 啟動 Trae。

依次點擊以下按鈕
開始——選擇主題（暗色、亮色、深藍），語言選擇簡體中文
導入vscdoe配置、導入Cursor配置（筆者選擇跳過）——安裝Trae命令——填寫手機號和接收到的驗證碼

添加 Trae 相關的命令行后，你可以在終端中使用命令行更快速地完成 Trae 相關的操作。例如：

• 使用 trae 命令快速喚起 Trae。
• 使用 trae my-react-app 命令在 Trae 中打開一個項目。

開始使用 Trae

在 Trae 中，開發你的項目，例如：

• 打開已有的項目或克隆 Git 倉庫。詳情參考《管理項目》。
• 使用 AI 助手從 0 到 1 創建一個新項目。詳情參考《Builder 模式》。

管理項目

你可以管理 Trae 中的項目，包括創建項目和切換項目。

什么是 “工作空間”？

“工作空間” 通常為一個在 Trae 中打開的文件夾。若你的項目較為復雜，也可以將多個文件夾添加至一個 “工作空間”。

創建項目

Trae 提供三種創建項目的方式：導入本地文件夾、克隆 Git 倉庫。

管理插件

在 Trae 中，你可以安裝、禁用和卸載插件。

安裝插件

你可以從 Trae 或 VS Code 的插件市場安裝插件。

從 Trae 的插件市場安裝

在左側導航欄中，點擊 插件市場 圖標。

界面左側顯示 插件市場 面板。
搜索你想要的插件并在 未安裝 列表中將其選中。
界面上顯示該插件的詳情窗口，展示該插件的詳細說明、變更日志等信息。
點擊 安裝。
Trae 開始安裝該插件。安裝完成后，該插件會出現在 已安裝 列表中。

從 VS Code 的插件市場安裝

如果 Trae 的插件市場未提供你所需的插件，可以將 VS Code 插件市場中的插件安裝至 Trae。

1. 前往 VS Code 的插件市場。
2. 搜索你想要的插件，例如：EIDE。

1. 在搜索結果中，點擊你所需的插件。

你會前往該插件的詳情頁。

1. 在詳情頁中，點擊 Version History。
2. 結合插件頁的 URL 和 Version History 中的信息，提取出以下信息（以 Pylance 為例）：

• • itemName：URL Query 中的 itemName 字段，如截圖中的 CL.eide，并將小數點（.）前后的內容分成以下兩個字段：

  • • fieldA：CL
    • fieldB：eide

  • version：如截圖中的 3.21.1

1. 使用提取出來的 3 個字段的值替換下方 URL 中的同名字段。

模板：
https://marketplace.visualstudio.com/_apis/public/gallery/publishers/${itemName.fieldA}/vsextensions/${itemName.fieldB}/${version}/vspackage示例：
https://marketplace.visualstudio.com/_apis/public/gallery/publishers/CL/vsextensions/eide/3.21.1/vspackage

1. 在瀏覽器中輸入修改后的 URL，然后按下回車鍵。
   瀏覽器開始下載該插件。

2. 下載完成后，返回 Trae 并打開插件市場。

3. 將下載的 .vsix 文件拖拽至 插件市場 面板中。
   Trae 開始自動安裝該插件。安裝完成后，該插件會出現在 已安裝 列表中。

禁用插件

1. 在 Trae 中，打開插件市場。
2. 在 已安裝 列表中，找到需禁用的插件。
3. 鼠標懸浮至列表中的插件，然后點擊 設置 > 禁用。

或

• 點擊該插件以打開其詳情窗口，然后點擊 禁用。

卸載插件

1. 在 Trae 中，打開插件市場。
2. 在 已安裝 列表中，找到需卸載的插件。
3. 鼠標懸浮至該插件，然后點擊 卸載。

或

• 點擊該插件以打開其詳情窗口，然后點擊 卸載。

插件常見問題

暫不支持安裝 VS Code 插件市場中某個版本的插件

若 VS Code 插件市場中某個版本的插件依賴了新版 VS Code 中的某些接口，則可能會導致該插件與 Trae 不兼容。你可以查看該插件的 Version History，然后下載該插件的歷史版本。

Builder模式
全新 Builder 模式，快速從 0 到 1
Builder 模式下，Trae 會自主拆解需求并自動完成多輪編碼任務。從想法描述到功能實現，Trae 為你一氣呵成。

上下文理解
全面理解代碼倉庫，準確解決需求
Trae 可以深入理解你的代碼倉庫，并深度結合 IDE 內信息，更準確識別你的需求，為你提供更優質的解決方法。

• 代碼倉庫
• 文件夾
• 文件
• 代碼塊

自動補全
實時代碼續寫，極致提速
通過強大的上下文分析，Trae 可以實時預測和續寫你的代碼片段，快速無縫擴展你未完成的代碼，數倍提升你的編碼效率。

AI 協作
智能 AI 協作，暢享絲滑體驗
你可以將 AI 生成的代碼一鍵應用到多個模塊，還可以隨時調整指令，實時預覽 AI 生成代碼的前端效果……更多暢快體驗，等你探索。

• 實時預覽
• 一鍵應用
• 版本回退

---

對比其它AI代碼編輯器

Trae IDE
功能豐富的AI編輯器，集成Claude 3.5和GPT-4，提供強大的智能編程體驗。所有功能免費。
Cursor
一款從零開始構建的現代AI編輯器，完全為AI集成優化。
GitHub Copilot
GitHub官方推出的AI編程助手
Codeium Windsurf
支持20多種編程語言的AI代碼補全工具。
Tabnine
支持多種編程語言的AI代碼補全工具。
Replit
強大的在線IDE，支持超過50種編程語言，具有實時協作功能。
Amazon CodeWhisperer
亞馬遜推出的AI編程助手，專注于AWS服務和API的支持。
在線 AI 編輯器
Devv AI
專為開發者打造的智能搜索引擎，帶有在線代碼運行環境（測試版）
Bolt
StackBlitz推出的在線開發環境，集成AI功能

---

常見問題解答

Trae IDE與其他AI編程工具有什么不同？

Trae IDE通過提供對GPT-4和Claude 3.5的無限免費訪問、全面的IDE功能和無縫GitHub集成，脫穎而出。所有功能都是完全免費的。

Trae IDE真的免費嗎？有什么限制嗎？

是的，Trae IDE完全免費，沒有隱藏費用。作為字節跳動的產品，致力于讓先進的AI編程工具為所有開發者所用。

Trae IDE支持哪些操作系統？

目前，Trae IDE支持macOS，Windows支持將于2025年2月晚些時候推出。Linux支持計劃在未來發布。

我可以使用現有的VSCode擴展嗎？

是的！Trae IDE基于VSCode構建，并支持大多數VSCode擴展。您可以輕松導入現有的VSCode設置和擴展。

AI助手如何離線工作？

雖然核心IDE功能可以在離線狀態下工作，但AI助手需要互聯網連接來訪問GPT-4和Claude 3.5。我們通過優化API調用來確保最小延遲。

---

什么是 Trae Builder？

Trae Builder 模式可以幫你從零開始開發一個完整的項目。你可以輕松地把它融入到你的項目開發過程中。

在 Builder 模式下，AI 助手會根據你的需求使用各種工具來回應。這些工具包括分析代碼文件、編輯代碼文件、運行命令等等，讓回應更準確、更有效。

Builder 模式是怎么工作的？

在 Builder 模式下，AI 助手會主動讀取當前項目文件的內容，把任務分解成小步驟，然后一步一步執行。包括：

• 提取相關的上下文
• 創建或修改文件
• 生成和運行命令
• 分析命令執行的狀態

如何開啟 Builder 模式？

1. 用快捷鍵 command + U 打開側邊聊天框
2. 在 AI 聊天框的左上角，點擊 Builder 就可以開啟 Builder 模式

探索 Builder 模式

Builder 模式提供了一系列實用的功能，可以有效地幫你從 0 到 1 精準高效地開發項目。

添加上下文

AI 助手能理解當前項目的上下文，包括代碼、文件和文件夾，這樣就能更準確地幫你實現開發需求。想了解更多，可以看看"上下文"部分。

輸入多模態內容

你可以在聊天中添加圖片，比如錯誤截圖、設計草圖、參考樣式等等，這樣可以更準確、更高效地表達你的需求。想了解更多，可以看看"多模態輸入"部分。

生成和處理代碼變更

根據你的需求，AI 助手會自動生成代碼變更，包括創建新文件和編輯現有文件的代碼。

為了讓你預覽代碼變更，Trae 會自動保存 AI 助手生成的代碼變更。如果你拒絕了代碼變更，這些變更就會從硬盤中刪除。

你可以接受或拒絕代碼變更，包括：

• 處理多個文件中的所有代碼變更：在輸入框上方的文件列表中點擊"全部接受"或"全部拒絕"按鈕，就可以批量接受或拒絕當前項目中的所有代碼變更。
• 處理一個文件中的所有代碼變更：在編輯器中打開文件，點擊頂部提示欄中的接受（快捷鍵：Command + Enter）或拒絕（快捷鍵：Command + Backspace）按鈕，就可以批量接受或拒絕當前文件中的所有代碼變更。
• 處理單個代碼變更：在編輯器中點擊特定代碼變更右上角的 ^Y 或 ^N 按鈕，就可以接受或拒絕這個特定的變更。

生成和運行命令

根據你的需求，AI 助手會及時推薦你需要運行的 Shell 命令。你可以選擇運行或跳過命令，AI 助手會根據你的操作繼續后續任務。

點擊運行后，命令會在 Trae 的終端中執行。命令運行完后，AI 助手會自動讀取和分析結果。如果執行過程中出現問題，AI 助手會分析原因并提供解決建議。

如果命令運行成功，你可以點擊命令卡片右上角的終端按鈕，在終端中查看該命令的執行日志。

預覽結果

當 AI 助手完成了你的需求后，它會提供一個預覽按鈕。點擊這個按鈕會在 Trae 中打開一個 Webview 窗口來展示結果。

在預覽過程中，如果你繼續和 AI 助手交互并修改需求，結果會在 Webview 窗口中實時更新。

在 Webview 窗口的右上角，你可以點擊"在瀏覽器中打開"按鈕，在瀏覽器中打開窗口預覽結果。

回退到之前的版本

你可以把項目回退到某次聊天之前的版本。

• 回退后不能撤銷
• 只支持回退最新的 Builder 窗口中的項目
• 只支持回退項目到最近 10 次聊天中的版本

回退步驟：

1. 找到目標聊天氣泡
2. 在左側點擊回退按鈕
3. 會彈出顯示受影響文件的對話框
4. 點擊文件名可以在編輯器中預覽變更
5. 確認影響，如果可以接受就點擊確認
6. AI 助手就會開始回退操作

管理歷史聊天

點擊 Builder 窗口右上角的"顯示歷史"按鈕，左側會出現歷史面板，顯示聊天模式和 Builder 模式的所有歷史聊天。

要查看特定的歷史聊天，點擊對應的條目就可以跳轉到那部分。

如果你需要刪除某個歷史聊天，把鼠標懸停在想要的條目上，點擊右側的刪除按鈕就可以。注意，刪除的聊天是不能恢復的。

---

Trae IDE 快捷鍵怎么設置

Trae 提供了多種鍵盤快捷鍵來提高你的開發效率。以下是使用方法：

常用鍵盤快捷鍵

文本編輯

操作	鍵盤快捷鍵 (macOS)
新建一行	Command + Enter
復制一行（無需選中）	Command + C
剪切一行（無需選中）	Command + X
粘貼一行	Command + V
選中一行（或下一行）	Command + L
撤銷操作	Command + Z
重做操作	Command + Shift + Z
注釋/取消注釋一行	Command + /
打開搜索框	Command + F
查找下一項	Enter
查找上一項	Shift + Enter
重命名符號	F2 或 Enter
跳轉到定義	Command + F12
觸發代碼自動補全	Ctrl + Space

全局設置

操作	鍵盤快捷鍵 (macOS)
打開命令面板	Command + Shift + P
打開文件導航器	Command + P
打開全局搜索	Command + Shift + F
打開設置	Command + ,

AI 聊天

操作	鍵盤快捷鍵 (macOS)
打開側邊 AI 聊天框	Command + U
打開內聯 AI 聊天框	Command + I

管理鍵盤快捷鍵

要自定義你的鍵盤快捷鍵：

1. 點擊 Trae 右上角的個人頭像
2. 選擇鍵盤快捷鍵
3. 在鍵盤快捷鍵窗口中，右鍵點擊任意快捷鍵條目可以：
   • 修改現有的快捷鍵綁定
   • 添加新的快捷鍵綁定
   • 刪除快捷鍵綁定
   • 執行其他自定義選項

---

使用Trae AI IDE

# 新建項目文件夾
mkdir test
# 用trae命令打開項目文件夾
trae test

請使用HTML5 Canvas和JavaScript開發一個俄羅斯方塊游戲，創建tetris.html文件和tetris.js文件。要求實現游戲的核心邏輯，包括方塊生成、移動、旋轉、碰撞檢測、計分等功能。

安裝Live Server插件，點擊右正解的Go Live預覽游戲。