个人网站：# 编程指北 X 计算机学习指南
大家好，我是小北。
最近似乎巨头们都开始盯上 AI IDE 这个方向了，OpenAI 想用 30 亿美元收购 Windsurf，Cursor 也是估值一路涨到近百亿。
而国内科技巨头字节也在这个领域强势布局，率先推出了国产的 AI 原生 IDE ------Trae。
Trae 这个名字其实是个缩写，其含义为为：The Real AI Engineer
年初我还介绍过 Trae ，当时刚出来只有海外版，主打免费 Claude。
后面又推出了国内版本: sourl.cn/i9HHSn，可以说是填补了国内这块的空白。
区分国内国外版本主要是底层模型合规问题，差别也主要是底层的模型，其它能力都是通用的：
- 国内版：DeepSeek R1、V3、v3-0324和 Doubao1.5 pro，同时支持自定义模型
- 海外版：内置Claude 3.5、3.7，GPT-4.1/4o，Gemini-2.5-Pro 等 ，一样可以自定义模型
其实目前 DeepSeek v3-0324 编码体验不输 Claude 3.7。
在前两天打开 Trae 的时候，发现连续两天都发布了更新：
主要是扩充了 Context，可以来源网页链接或者本地文档，另外，支持了最近很火的 MCP 和自定义智能体。
为了测试它实际效果咋样，我用智能体 + MCP 来 自动 Copy 部署一个导航站：https://freedeepseek.cn/
这个导航站是年初 DeepSeek 官网老是服务繁忙，所以当时我把接入过 DeepSeek 好用的服务列到了上面，方便使用：
靠着把链接里加一个邀请码，邀请了很多用户使用，这个导航站总共给我在各个平台薅了价值几千块的 Token，比如这是火山引擎的：
MCP
先简单说下 MCP 是啥，这是最早 Anthropic 提出的：
MCP（模型上下文协议）可以理解为 AI 的**"万能插头"**，就像 USB-C 接口能让手机连接各种充电器、耳机、电脑一样，MCP 让 AI 大模型（DeepSeek、Claude)能通过统一标准连接外部工具和数据源，一下子让 AI 具备了使用很多工具的能力。
那 Trae 这种 IDE 接入 MCP 有啥好处呢？
太多了！ 比如可以直接把 Figma 设计稿链接发给 Figma MCP 读取，然后使用大模型进行前端代码实现，
又比如 MySQL MCP 可以方便一句话帮我们 mock 测试数据表。
在 Trae 里，可以在右上角设计里面找到 MCP 入口，或者是对话框【添加更多工具】：
点进去之后，市场有很多预置的 MCP，有【轻松配置】标签的 MCP 基本上填一个 key 就能使用，比如 Puppeteer 无头浏览器 MCP：
其它的会麻烦一些，需要自己去第三方市场，或者自己部署，这里推荐下前同事 idoubi 大佬的 mcp.so 导航站 （mcp.so/）：
常见的 MCP 可以一键 copy json 配置：
我用它配置了一个 edgeone-pages-mcp，地址：mcp.so/playground?...
它的作用是把静态 HTML 部署到 edgeone 上面，提供一个公网可访问的 URL：
在 Trae MCP 页面点击【手动配置】，把对应的 json 配置拷贝过来即可：
所有需要的 MCP 都配置好后，相当于给我们的 Trae 加上了外挂能力，目前我加了三个：
智能体
除了 MCP，Trae 这波更新还支持创建自定义智能体。
简单来说，就是选一堆的 MCP （工具） + 提示词（如何使用工具），就是相当于用提示词来把这些相关的 MCP 串一个工作流：
比如我搞的这个导航站 Copy 大王 智能体：
后面就是直接 @ 使用这个智能体就好了。
下面我来简单演示下具体操作方法：
智能体使用
接下来只需要 @ 导航站 Copy 大王，然后把需要 Copy 的网站发给它即可：
可以看到它拆解了以下几步：
- 使用 puppeteer mcp 抓取网页结构化数据
- 保存到 site.json 文件
- 使用大模型按照要求进行编写 HTML 代码
- 使用 edgeone mcp 部署 HTML 代码，拿到可访问的 URL
不过 puppeteer 在抓取数据的时候，tags 标签部分似乎没抓到，不过也是小问题，我让它 AI 自己抓取 Web 上的信息，补充这些站点的特点作为 tag：
最终部署的地址，大家也可以访问：
https://mcp.edgeone.site/share/kTPNrg_ftsuQKOORA37JM
页面效果如下图：
我觉得非常不错了，基本复原了 70%，至于布局不同，因为提示词本身也没让 AI 跟谁原本网站布局，智能体的提示词是"现代导航风格的导航站"。
不过可以考虑使用 puppeteer 无头浏览器截图原网站页面来复刻。
毕竟现在 Trae 也支持多模态（需要用 Claude 模型，海外内置claude可用，国内自定义添加claude可用）
所以我切换成 Trae 海外版来试一下直接截图原网站调整 UI：
效果如下图：
链接：mcp.edgeone.site/share/um6r0...
不得不说， 有点东西啊！
看来还是直接截图 + Trae 多模态更加好使啊！
更强的Context + Rule
除了 MCP 和智能体，Trae 这次还扩充了上下文：支持联网 + 文档集
其中：
- #Web：支持联网搜索，可直接粘贴链接，AI 自动提取网页内容作为上下文。
- #Doc：支持通过 URL 或上传 .md / .txt 文件添加文档集，最多支持 1000 个文件（50MB）。
联网搜索现在是刚需，能获取更加实时的信息，直接丢个 URL 明显省事多了 。
进入上下文配置页面，即可通过 URL 或者本地文件的形式添加 #Doc，非常适合把一些需求背景相关 pdf、文档添加进来：
另外一个就是 Trae 也支持配置 Rule了，可以配置一些全局或者项目级别的规则。
作用就是来约束 AI 使用的技术栈和生成代码的规范等等，让AI生成更符合我们需求的代码
比如我添加了一个来自 waytoagi 上面适合前端代码生成的 rule：
END
另外，之前一直以为 Trae 和原来的 MarsCode 是字节两个AI 编程两个方向，没想到是一个团队的产品。
并且，最近他们合并了，只保留 Trae 这个品牌，MarsCode 插件也改叫 Trae 插件了，这个 Trae 插件也上线了 Builder 能力，支持0-1构建项目。
插件适用于深度依赖现有开发环境的同学，可直接集成到主流 IDE （VSCode、JetBrains等）中，兼容性强、使用灵活，无需改变原有工作流，即可享受 AI 赋能带来的效率提升。
而如果想要深度使用原生的 AI IDE魅力，还是建议大家下一个 Trae IDE，将 AI 深度融合于 IDE 之中，从代码编写到项目执行。
Trae怎么安装？
Trae 目前国内海外版都免费，可以通过官网/阅读原文下载：
个人网站：# 编程指北 X 计算机学习指南