配置Trae的MCP保姆级教程

没有Trae的小伙伴可以先下载个Trae，下载非常简单这里就不介绍了。写这篇文章是因为自己想用Trae的MCP的时候看了CSDN上的很多帖子都没有系统清晰的来教怎么配置的，所以UP也是看了很久的文章自己总结了一下，来帮助需要的宝子们更快的配置好环境来提高生产力。好了，正文开始！！！

一、Tre的介绍

csdn上的关于新版的trae配置几乎为空的，那就都闪开，让up来！

1.chat模式（适合AI问答辅助学习）--回答bug问题、讲解代码仓库、生成代码片段

①复制、插到光标所在处、添加到新文件，它会帮你创建一个文件并写入、应用到相应文件，它会将代码应用到相应的文件

②当需要对特定代码进行精确操作时候，选中特定代码，然后ctrl+i打开行内对话框，输入需求

当对特定代码进行提问的时候，选中特定代码，然后ctrl+u进行操作

③#workspace引用整个项目而不是单个文件，可以迅速了解从 GitHub 上拉取的代码结构

④上下文

可以在文件中选中代码片段或在终端中选中报错日志以及使用#选择文件或目录，指定AI的上下文以提供更符合正确的回答

2.Builder模式（从0到1构建一个完整的项目）--编写项目、提取报错自动修复

编写完成后，会给出一个预览按钮，点击预览之后会在 Trae 内打开一个 Webview 预览窗口，有问题修改后会实时更新窗口的结果，最后接受就行

二、MCP

理解MCP：AI 模型通过连接外部应用来扩展功能时，每个外部应用的接口都不一样，就需要写每个接口的适配代码。MCP统一了外部应用的接口格式并进行了封装，使得AI模型都可以根据统一的格式接入。

三、配置MCP

MCP有两个关键依赖npx 和 uvx，所以得先安装这两。

步骤一：安装Node.js

1.打开Node.js 中文网选择和自己系统匹配的版本下载并安装

安装后在终端输入node -v 和npm -v 看是否输出版本号

2.配置环境

①在你安装Node.js的目录下新建两个文件夹node_global和node_cache

②复制刚刚创建的两个文件夹路径在cmd命令（使用管理员打开）分别输入下面两条命令（红色框中的）

npm config set prefix "E:\A-Nodejs\node_global"

npm config set cache "E:\A-Nodejs\node_cache"

再输入npm config get prefix和npm config get cache（蓝色框中的）看是否输出对应的node_global和node_cache路径，输出则成功

③配置环境变量

（1）首先在系统变量中新建下图，无脑赋值就好

（2）打开用户变量中的Path，将默认的 C 盘下AppData\Roaming\npm修改成 node_global的路径

（3）在系统变量中的Path新建%NODE_PATH%

④以管理员身份输入npm install express -g 全局安装一个最常用的 express 模块

出现这个界面则代表可以

⑤安装淘宝镜像

输入npm config set registry https://registry.npmmirror.com安装淘宝镜像

输入npm config get registry查看是否成功

⑥安装cnpm

输入npm install -g cnpm --registry=https://registry.npmmirror.com安装cnpm

输入cnpm -v查看是否安装成功

步骤二：安装UVX

Windows用户输入

powershell -ExecutionPolicy ByPass -c "irm https://astral.sh/uv/install.ps1 | iex"就行

步骤三：添加token

到这里所有MCP的外配置任务就已经完成了，恭喜你，下面进入Trae内部教学

方式一：

以github为例说明怎么添加token。通过打开浏览器，登录 GitHub → 点击右上角头像 → Settings（设置）→ Developer settings（开发者设置）→ Personal access tokens（个人访问令牌）→ Tokens (classic)，点击 Generate new token → Generate new token (classic)，在Note中输入描述（如 MCP Server）然后在Expiration中选择令牌有效期（如 30 天）。在Select scopes中勾选至少以下权限：repo（访问仓库）、read:org（读取组织信息），然后点击 Generate token，复制生成的令牌（一串以 ghp_ 开头的字符），最后填入自己的 Figma Token。

方式二：

当你点了对应的MCP后面的加号后，会出现蓝色标亮字体，点击后创建自己的token 输入红色框点击确定就大功告成了

四、对提示词的理解

1.打开Buider模式

2.输入提示词和想要的样式图片

在让ai生成项目时需要丰富完整的提示词，这样ai就可以更好的工作

五、参考：

2024最新版Node.js下载安装及环境配置教程【保姆级】_nodejs下载-CSDN博客

MCP怎么调用？AI 编程 IDE（暨字节 Trae 调用 MCP 教程）_trae mcp-CSDN博客

Trae 重磅更新：AI编程+智能体+MCP，直接打开新世界入门！_trae mcp-CSDN博客