【AI智能編程】Trae-IDE工具學習

什么是Trae？

Trae與 AI 深度集成，提供智能問答、代碼自動補全以及基于 Agent 的 AI 自動編程能力。使用 Trae 開發項目時，你可以與 AI 靈活協作，提升開發效率。提供傳統的 IDE 功能，包括代碼編寫、項目管理、插件管理、源代碼管理等。

Trae是強大的AI助手，能夠實現智能問答，為我們提供實時代碼建議，幫助我們從0到1開發項目。

安裝Trae

進入Trae官網：https://www.trae.cn/?安裝Trae_CN

下載好安裝包后，打開啟動器會有一些初始化選項：

第一步：選擇主題和語言

選擇主題。可選項為?暗色、亮色?和?深藍。
選擇顯示語言。可選項為?簡體中文?和?English。

第二步：從 VS Code 或 Cursor 中導入配置

若你的電腦中已安裝并配置 VS Code 或 Cursor，你可以點擊?從 VS Code 導入?或?從 Cursor 導入?按鈕。系統將會從對應的 IDE 中獲取插件、IDE 設置、快捷鍵設置等信息并一鍵導入到 Trae 中，幫助你快速從其他 IDE 切換到 Trae。

第三步：添加 Trae 相關的命令行

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

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

第四步：登錄賬號

使用手機號或稀土掘金帳號登錄 Trae。完成登錄后，你才可以在 Trae 中使用 AI 服務。

第五步：開始使用 Trae

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

打開已有的項目或克隆 Git 倉庫。
使用 AI 助手從 0 到 1 創建一個新項目。

Trae側邊對話（Chat模式）

打開 Chat 模式

進入 Trae 后，一般默認進入 Chat 模式。若非如此，可以參考以下步驟打開 Chat 模式。

使用快捷鍵（macOS：Command + U；Windows：Ctrl + U）打開側邊對話框。
在側邊對話框的左上角，點擊?Chat。

選擇模型

Chat 模式默認使用 “Doubao-1.5-pro”。你可以點擊模型名稱，然后選擇切換至 DeepSeek-Reasoner (R1) 或 DeepSeek-Chat (V3) 模型。

此外，對于對話中生成的代碼塊，你可以進行以下處理：

編號	說明
1	點擊?復制?按鈕，復制代碼塊中的全部內容。
2	在編輯器內的文件中，點擊目標區域，然后點擊?插入到光標處?按鈕，將代碼塊中的內容插入到文件內的光標處。
3	點擊?添加到新文件?按鈕，新建一個文件，并將代碼塊中的內容添加至該文件。
4	若為代碼變更，則可以點擊?應用?按鈕，將變更后的代碼應用至相應的文件。?提示：不支持應用和當前工作空間項目無關的代碼。

生成并運行命令

Chat 模式下，根據你的需求，AI 助手會提供可一鍵運行的 Shell 命令。

你可以按需進行以下操作：

編號	說明
1	點擊?復制?按鈕，復制該命令。
2	點擊?添加到終端?按鈕，將命令添加至未被占用的終端。
3	點擊?運行?按鈕，在未被占用的終端中運行該命令。

回退版本

你可以將項目回退至指定會話輪次發起前的版本。

提示

回退操作不可撤銷；
僅支持在最近活躍的 Builder 窗口中回退版本；
僅支持回退至最近 10 輪會話內的版本。

找到目標對話氣泡。
點擊左側的?回退?按鈕。

對話框中展示本次回退會影響的文件。

點擊文件名，編輯器內會打開該文件，顯示即將發生的變更。
確認本次回退的影響范圍。
若本次回退符合預期，點擊?確定。

AI 助手開始回退項目。

管理歷史對話

點擊?Chat?窗口右上角的?歷史會話?按鈕后，左側會顯示?歷史記錄?窗口，展示 Chat 模式和 Builder 模式的所有對話記錄。

若你需要查看某輪歷史對話，點擊該對話條目，你會跳轉至該對話的位置。
若需要刪除某輪對話，可以將鼠標懸浮至該對話，然后點擊右側的?刪除?圖標。

提示：對話記錄刪除后無法恢復。

Trae Builder模式

Builder 模式的工作流程

Builder 模式下，AI 助手會主動讀取當前項目中的文件內容，拆解任務并逐步執行，包括：

提取相關上下文
創建或修改文件
生成并運行終端命令
分析命令運行狀態

啟用 Builder 模式

使用快捷鍵（macOS：Command + U；Windows：Ctrl + U）打開側邊對話框。
在側邊對話框的左上角，點擊?Builder。
在?Builder?對話框中，點擊?啟用 Builder?按鈕。

選擇你想使用的大語言模型。

輸入多模態內容

你可以在會話中添加圖片，例如報錯截圖、設計稿、參考樣式等等，從而更加準確高效地表達需求。

生成并處理代碼變更

根據你的需求，AI 助手會自動創建新文件或編輯已有文件，并自動保存生成的代碼。你可以選擇接受或拒絕代碼變更，包括：

處理多文件內的所有代碼變更：點擊輸入框上方待審查文件列表中的?全部接受?或?全部拒絕?按鈕，批量接受或拒絕當前項目中的所有代碼變更。

處理單文件內的所有代碼變更：在編輯器內打開文件，點擊上方提示條中的?接受?按鈕（快捷鍵：macOS 為 Command + Enter；Windows 為 Ctrl + Enter）或?拒絕?按鈕（快捷鍵：macOS 為 Command + Backspace；Windows 為 Ctrl + Backspace），批量接受或拒絕當前文件內的所有代碼變更。

處理單處代碼變更：在編輯器內，將鼠標懸浮至某個代碼變更處，然后點擊右上角的?^Y?按鈕（快捷鍵：macOS 為 Control+Y；Windows 為 Alt + Y）或?^N?按鈕（快捷鍵：macOS 為 Control + N；Windows 為 Alt + N），接受或拒絕該變更。

生成并運行命令

根據你的需求，AI 助手會適時推薦必要的 Shell 命令供你運行（以下圖為例）。你可以選擇運行或跳過某個命令，AI 助手會根據你的操作完成后續的工作。

點擊?運行?后，終端將運行該命令。命令運行后，AI 助手會自動讀取并分析運行結果。如果運行異常，AI 助手會自動分析原因，并給出建議解決方案。

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

預覽成果

AI 助手完成開發需求后，會提供?預覽?按鈕。點擊后，Trae 會打開?Webview?窗口，用于展示開發成果。

預覽過程中，若你繼續與 AI 助手對話，修改需求，開發成果會在?Webview?窗中實時更新。在?Webview?窗口的右上角，點擊?在瀏覽器中打開?按鈕，可在瀏覽器中打開窗口，預覽開發成果。

回退版本

你可以將項目回退到指定會話輪次發起前的版本。

回退操作不可撤銷；
僅支持在最近活躍的 Builder 窗口中回退版本；
僅支持回退至最近 10 輪會話內的版本。

使用以下步驟回退項目的版本：

找到目標對話氣泡。
點擊左側的?回退?按鈕。

對話框中展示本次回退會影響的文件。

點擊文件名，編輯器內會打開該文件，顯示即將發生的變更。
確認本次回退的影響范圍。
若本次回退符合預期，點擊?確定。

Builder 開始回退項目。

管理歷史對話

點擊?Builder?窗口右上角的?歷史會話?按鈕后，左側會顯示?歷史記錄?窗口，展示 Chat 模式和 Builder 模式的所有對話記錄。

若你需要查看某輪歷史對話，點擊該對話條目，你會跳轉至該對話的位置。
若需要刪除某輪對話，可以將鼠標懸浮至該對話，然后點擊右側的?刪除?圖標。

Trae上下文

與 AI 助手對話時，你可以指定 Trae 中的內容（包括代碼、文件、文件夾、工作空間）作為上下文供 AI 助手閱讀和理解，從而確保 AI 助手的答復更符合你的要求。

方式一：將編輯器內的內容作為上下文

當你的編輯器中存在正在編輯的代碼文件時，AI 助手默認能夠看到當前文件。你可以直接向 AI 助手提問與當前文件相關的問題。若期望對文件中的某一段代碼進行提問，

使用以下步驟：

選中代碼。
點擊懸浮菜單中的?添加到對話?按鈕，將選中的內容作為上下文添加至側邊對話框。

方式二：將終端中的內容作為上下文

若你希望對終端中的輸出內容進行提問（如幫助你修復報錯），使用以下步驟：

在終端中，點擊輸出內容片段。
在內容片段區域的右上角，點擊?添加到對話?按鈕，將選中的內容作為上下文添加至側邊對話框。

指定的上下文會顯示在側邊對話底部的輸入框。以下圖為例，輸入框內顯示上下文的來源以及行號。

方式三：使用 # 鍵添加上下文

在側邊對話的輸入框中，你可以通過 # 符號添加多種類的上下文，包括代碼、文件、文件夾和工作區。通常情況下，列表中將展示與編輯器中當前打開文件相關的內容作為推薦的上下文，但你仍然可以自行搜索所需的上下文并將其添加到輸入框中。基于你的問題，你可以組合添加各種來源的相關上下文（例如同時添加代碼和文件）。

Code

通過 #Code，你可以將函數或類的相關代碼作為與 AI 助手對話的上下文。列表中默認展示當前編輯器內打開的文件中的函數或類。選擇前，你可以預覽列表中推薦的函數或類的相關代碼。若推薦的內容非你所需，你可以通過關鍵詞搜索所需的函數或類。

File

通過 #File，你可以將指定文件中的所有內容作為與 AI 助手對話的上下文。列表中默認展示近期在編輯器中打開過的文件。你可以預覽這些文件所在的目錄，以免因存在同名文件而導致錯選。若展示的文件非你所需，你可以通過關鍵詞搜索所需文件。

Folder

通過 #Folder，你可以將指定文件夾中的所有內容作為與 AI 助手對話的上下文。

Workspace

你可以使用 #Workspace 來向 AI 助手提出有關整個工作空間的問題，AI 助手將自動在工作空間中查找與你的問題最相關的內容作為上下文進行回答。遇到不熟悉的項目時，該功能可以幫助你全局了解該項目所實現的功能和代碼，從而使你快速上手該項目的開發。

#Web

你可以將線上網站的內容作為 AI 對話的上下文。

直接在 #Web 后輸入你的問題并發送。這種方式會觸發聯網搜索，Trae AI 會在全網搜索與提問相關的內容并生成答復。

忽略文件

Trae IDE 默認忽略 .gitignore 文件中所羅列的文件。除此之外，你可以自主設置 Trae IDE 在索引倉庫時需要額外忽略的文件列表，以作為 .gitignore 文件中已定義規則的補充。

使用 #Workspace 或 #Folder 添加上下文時，被忽略的文件或文件夾將無法被作為上下文。

示例以下為 .ignore 文件內容的示例：

**/foo:     忽略 /foo, a/foo, a/b/foo 等
*.log:      忽略所有 .log 文件
config.js:    忽略當前路徑的 config.js 文件/mtk/      忽略整個文件夾
*.zip      忽略所有.zip文件
/mtk/do.c    忽略某個具體的文件

Trae 配置自定義規則Rules

什么是 Rules

Rules 是一項強大的代碼規范管理工具?，它允許團隊或開發者自定義并強制執行代碼風格和最佳實踐。

規則類型

個人規則

個人規則是基于個人使用習慣和需求為 AI 定制的規則，旨在讓 AI 的輸出更符合用戶的個性化要求。個人規則在所有項目中生效。例如：

語言風格：偏好簡潔/嚴謹/幽默等表達方式。
操作系統：提供針對 Windows 或 macOS 操作系統的回答。
內容深度：是否需要詳細解釋、示例或僅需結論。
交互方式：如傾向于直接答案，還是引導式提問。

項目規則

項目規則是針對當前項目 AI 需要遵循的規則，僅在所配置的項目中生效。例如：

代碼風格：縮進（空格/制表符）、命名規范（駝峰式/snake_case）等。
語言與框架：優先使用的編程語言（如 Python/JavaScript）或框架（如 React/Django）。
API 限定：勿使用某些 API。

示例演示 接下來，小編將通過一個實戰案例為你演示如何使用 Rules 來提升開發效率。假設我們想要使用?Chakra 來優化?CSS?，可以通過以下提示詞配置項目規則和個人規則。

項目規則：

你是一位精通 React和 Chakra UI 的前端開發專家。
?
## 核心原則 - 編寫清晰、簡潔且技術性強的回答,并提供精確的 Chakra UI 示例。
- 利用 Chakra UI 的組件和工具類來提升開發效率并確保響應式設計
- 注重代碼的可維護性和可讀性,始終道循簡潔規范的 HTML與 CSS 編碼實踐。
- 使用具有描述性的類名和結構,提升代碼清晰度,方便團隊協作。
?
## Chakra 使用規范-通過 Chakra UI 實現合理的組件組合結構
- 使用 Chakra UI 內置的無障礙功能
- 使用'as'屬性渲染語義化 HTML 標簽
- 利用 Chakra UI 的顏色模式實現暗黑模式
- 使用 Chakra UI 的布局組件實現響應式設計
- 遵循 Chakra U 最佳實踐以優化性能
- 在應用的根組件使用 ChakraProvider
- 使用 Chakra UI 組件以保持設計一致性
- 實現自定義主題以適配品牌樣式
- 使用 Chakra U 的斷點系統實現響應式樣式
- 使用 ChakraUI的 Hooks 提升功能性

個人規則：

請始終保持對話語言為中文
請在生成或編輯代碼時補充詳細的注釋
在回答用戶問題時,請詳細解釋每一步改動的原因

神級提示詞：https://www.cursorrulescn.cn/

Trae 多模態輸入

你可以在會話中添加圖片，例如報錯截圖、設計稿、參考樣式等等，從而更加準確高效地表達需求。

Trae 模型切換與自定義模型

Trae 預置了一系列業內表現比較出色的模型，你可以直接切換不同的模型進行使用。此外，Trae 還支持通過 API 密鑰（API Key）接入自定義模型，從而滿足個性化的需求。

切換模型

在 AI 對話輸入框的右下角，點擊當前模型名稱，打開模型列表，然后選擇你想使用的模型。各個模型的能力不同，你可以將鼠標懸浮至模型名稱上，然后查看該模型支持的能力。

添加自定義模型

如果你希望使用預置模型之外的其它模型，或者想使用自己的模型資源，則可以通過 API 密鑰連接你自己的模型資源或其他第三方模型服務商。

在 AI 對話框右上角，點擊?設置?圖標 >?模型。

界面上顯示?模型?窗口。

點擊?+ 添加模型?按鈕。

界面上顯示?添加模型?窗口。

選擇?服務商。可選項有：Anthropic、DeepSeek、OpenRouter、火山引擎、硅基流動、阿里云、騰訊云、模力方舟、BytePlus、Gemini。
選擇?模型：

- 直接從列表中選擇 Trae 為每個服務商預置的模型（均為默認版本）。
- 若你希望使用其他模型或使用特定版本的模型，點擊列表中的?使用其他模型，然后在輸入框中填寫模型 ID。

填寫?API 密鑰。

若你希望在服務商平臺上管理 API 密鑰，可以點擊?獲取 API 密鑰?按鈕，Trae 會為你打開對應服務商的 API 密鑰配置頁面。

點擊?添加模型?按鈕。

Trae 將調用服務商的接口來檢測 API 密鑰是否有效。可能的結果如下：

- 若連接成功，該自定義模型會被添加。
- 若連接失敗，添加模型?窗口中展示錯誤信息和服務商返回的錯誤日志，你可以參考這些信息排查問題。

管理自定義模型

在?模型?窗口中，你可以管理自定義模型。

編號	操作類型	說明
1	編輯模型	點擊?編輯?圖標，然后在彈窗中修改服務商、模型名稱、API 密鑰等信息。
2	刪除模型	點擊?刪除?圖標，然后在彈窗中二次確認。刪除后，當前模型將被從列表里移除，不可被繼續使用。
3	啟用/禁用模型	若你不希望刪除模型，但在一段時間內無需使用這個模型，你可以禁用該模型。被禁用的模型將保留在設置頁面的列表中，但不會出現在 AI 對話框的模型選擇列表中。