Trae 更新 MCP 和 Agent 能力，這次更新強度拉滿了 尤其是 Agent 支持組合 MCP 和提示詞能搞各種花活 趁著這次更新我也寫了一下我是如何進行 AI 編程（Vibe Coding）的 裡面有很多小技巧，順便教大家用 Trae 還有藏師傅的 15 條 Vibe Coding 建議先掏出來 詳細教程和 Trae 更新介紹在下面👇

先看一下Trae 發佈了四大重磅功能 現在其能力已與 Cursor、Windsurf 看齊、甚至體驗更勝一籌。例如可以自定義智能體，配合上MCP和prompt，能一次集結多個專屬AI專家，為我所用。 智能體創建：支持基於提示詞和MCP工具自定義智能體，@即可使用，不需要每次都輸入複雜指令

如果懶得等🚧施工的可以先去看長文：mp.weixin.qq.com/s/ADHNyGj17b4...

先來看結果 最近我發了很多 AI 編程和 4o 的圖片生成提示詞，很多朋友讓我搞個網頁整理一下，剛好這次想找個複雜的，我們就整一下。 支持 LLM 和圖片生成提示詞的篩選、支持模型篩選、支持點擊後展示全部內容、支持快速複製提示詞。

先來看環境配置的內容 首先，從官網下載安裝 Trae IDE，新建一個英文命名的空文件夾並在首次啟動時將其選為項目目錄。 接著，打開右上角 ⚙️ Settings → Rules，把「前端最佳實踐規則」整段粘進去，讓 AI 寫代碼自動遵守 Tailwind、DRY 和 ARIA 規範。 如果要讓 AI 參考設計稿或外部服務，再進入

梳理需求並整理提示詞 梳理需求時，先用「我想開發一個…」模板把目標用戶、使用場景和核心功能條理化寫出來，確保要點完整清晰，提示詞在圖裡。 然後用我的設計和開發要求提示詞。 再把設計風格與技術棧要求合併進同一段提示詞，讓 AI 一次讀懂視覺和代碼規範。 務必在首次提示詞裡寫到功能 1‑2‑3

預覽初稿後，照著「功能完整性 → 邊界數據 → 響應式佈局」三步清單逐項點擊、拉極端數據、切換不同屏寬，先確認核心交互無死角。 發現問題時遵循“一次只改一個 Bug / 功能”的原則，讓 AI 修完即回測，防止多點併發導致代碼發散。 若模型出現理解偏差，立即用 Trae 的 “回到發起前” 回滾對話，再用

部署時首選懶人流：把生成的項目文件夾直接拖進 yourware 或同類靜態託管服務，幾秒自動打包並分配公開 URL。 想要自定義域名或自動 CI/CD，就把代碼推到 GitHub 倉庫，再用 Netlify／Vercel 一鍵連接，啟用「main 分支 → 自動部署」流水線。 所有 API Key、密鑰類信息都改用平臺的 Environment

從我寫 Claude 的網頁提示詞到現在短短一個月時間整個服務 vibe coding 的生態和工具飛速發展，從 IDE 到專門為 AI 編程服務的前後端組件庫、數據庫，部署服務等等. 距離 Trae 國內辦法發佈沒多久，他就加了這麼多能力。 Vibe coding 現在只能做小工具小網頁，但是它不會一直只能做小工具小網頁。

好了教程到這裡就結束了，如果你有什麼問題也可以再評論區問，最好帶上詳細信息，我或者其他大神看到應該會給你解答。

用 Exa 的推特搜索給 Sam 推特做個分析網頁 x.com/op7418/status/1914561908...