Vibe Coding 正逐渐成为当前备受青睐的程序员人机协作模式。如今的程序员们，或多或少都会使用各种 AI 编辑器，不管是 Cursor、Windsurf 还是 Trae。倘若你还没有下载这些客户端，那大概率也试用过 Vscode 的插件，比如 Github Copilot。

在与 AI 进行交流时，我发觉自己频繁地切换 AI 模型（像突然推出的 Gemini）以及客户端（从 Cursor 到 Windsurf，然后又切回 Cursor）。

最让我感到困扰的是上下文的丢失。我总是得不断向 AI 解释与我的问题相关的必要信息，还得让它依照 “我的要求” 去处理任务。

可要是这些上下文能够实现移植，那会怎样呢？要是你在 Claude Desktop 里提出一个问题并获得答案，随后在利用 Cursor 进行编码时，还能调出这段对话，又会产生怎样的效果呢？

在本文中，我们将通过几个简单的步骤来搭建这样的工具。

一、为何要关注 MCP?

要是你已经对 MCP 了如指掌，想直接开始搭建，那就直接跳到 “快速上手” 部分。否则，准备好秒表，下面是 3 分钟的入门介绍。

1、 MCP 为何存在？

如果你期望拥有自主的AI智能体，那么必然离不开一些工具，这些工具能让AI智能体感知周围的世界，并与环境进行交互。然而，直接把AI助手与工具相连，集成的效果常常难以达到预期；只要AI模型或工具两端的API进行更新，代码就会出现错误。

那么，究竟要怎样才能构建出更强大、可重复使用的AI功能呢？

有一种可行的途径是借助Anthropic的模型上下文协议（MCP）。这是一种基于JSON-RPC的标准化通信层，能够让AI客户端（例如Cursor）发现并利用MCP服务器所提供的外部功能。

这些功能涵盖了对持久化数据（资源）的访问、在外部世界中执行各类操作（工具），以及接收关于如何使用这些资源和工具的具体指令（提示）。

2、 为何要使用 MCP 服务器？

像 Cursor 和 Windsurf 这样的客户端，即便没有 MCP 也已经拥有出色的 AI 智能体。那么，我们为什么还需要更多工具呢？

简单来说，客户端开发者无法打造所有功能。他们不想把所有开发时间都花在为每个新模型调整网络搜索上，而且他们肯定也不想自己去开发 Jira 集成功能。

MCP 让像 GitHub 和 Notion 这样的服务提供商能够维护自己的 AI 集成，这意味着更高质量的交互，还能减少重复工作。

所以，当你选择使用 MCP 服务器时，主要能获得前瞻性和可移植性这两大优势。你将拥有一个庞大的即插即用工具生态系统，可以在任何支持该标准的聊天窗口中使用。

3、 为何要自己搭建 MCP 服务器？

即便你不是那种需要将自己的服务 API 接入 MCP 的开发者，掌握相关知识也有很多好处。

对我来说，我发现花在搭建服务器上的时间越多，就越少感觉自己的工作只是在输入框之间复制粘贴大段文本。我在实现上下文自动化，这让 AI 模型对我个人来说更有用。

此外，在不断变化的 AI 领域，这感觉像是一种立足的方式。即便未来出现新的模型、客户端和服务，我现在构建的工具也应该能继续使用。

闲话少说，是时候动手了。下面将以 css mcp server 作为示例：

二、快速上手：让代码动起来？

我们通过以下三个步骤准备好代码库。目前先不用考虑 API 密钥或客户端设置的问题。

1. 克隆代码库：将示例代码（https://github.com/3mdistal/css-mcp-server）下载到本地计算机。

2. 安装依赖项：我们需要 MCP 软件开发工具包（SDK）和其他一些库。

3. 构建代码：将 TypeScript 源代码编译为可运行的 JavaScript 代码。

   现在，编译好的代码就在build/目录下。

1、运行你的第一个 Mcp Server

核心执行逻辑（src/index.ts）

打开主服务器文件src/index.ts ，你会看到以下关键部分：

1. 导入核心依赖 ：从@modelcontextprotocol/sdk中引入McpServer（核心服务器类）和StdioServerTransport（用于通信）。

import { McpServer } from "@modelcontextprotocol/sdk/server/mcp.js";
import { StdioServerTransport } from "@modelcontextprotocol/sdk/server/stdio.js";

2. 导入注册依赖：从src/目录下的其他文件中导入registerPrompts、registerResources和registerTools 。稍后会深入探讨这些函数，它们负责告知服务器我们想要赋予它的具体功能。

import { registerPrompts } from "./prompts/index.js";
import { registerResources } from "./resources/index.js";
import { registerTools } from "./tools/index.js";

3. 服务器实例化：创建服务器实例，设置服务器的名称和版本，并为其功能初始化空占位符。

export const server = new McpServer({
    name: "css-tutor", // Unique name for this server
    version: "0.0.1", // Server version
    // Declare the types of capabilities the server will offer
    capabilities: {
        prompts: {},  // Will be populated by registerPrompts
        resources: {},// Will be populated by registerResources
        tools: {},    // Will be populated by registerTools
    }
});

4. 调用注册函数：调用导入的register*函数，这些调用会用在其他地方定义的实际工具、资源和提示来填充服务器实例。

registerPrompts();
registerResources();
registerTools();

5. main函数：这个异步函数设置通信传输并连接服务器。

async function main(): Promise<void> {
    // Use StdioServerTransport to communicate over standard input/output
    // This is common for MCP servers launched as child processes by clients.
    const transport = new StdioServerTransport();
    // Connect the server logic to the transport layer
    await server.connect(transport);
}

6. 执行：最后，调用main() ，并进行基本的错误处理。

main().catch((error: Error) => {
    console.error("Server startup failed:", error); // Log errors to stderr
    process.exit(1);
});

这个结构是服务器的核心，它完成初始化、注册功能，并建立通信连接。

创建一个最简服务器，临时修改版本（用来测试）

为确保这个核心循环在无需任何外部 API 或复杂逻辑的情况下也能正常工作，我们暂时修改src/index.ts：

1. 注释掉功能注册调用。
2. 在main函数定义之前添加一个简单的 “hello” 函数。
3. 重新构建代码。

对src/index.ts进行这些修改后，我们现在就有了一个可运行的 MCP 服务器，它只提供一个基本工具。目前这个工具没什么实际作用，但它证明了核心结构和通信设置是有效的。

使用 MCP Inspector 进行调试

现在我们有了一个最简且可运行的服务器，那如何检查它是否正确遵循 MCP 协议呢？我们使用 Anthropic 的 MCP Inspector。

这个命令行工具就像是一个基本的 MCP 客户端。它启动你的服务器进程，通过标准输入输出（就像 Claude Desktop 或 Cursor 那样）连接到服务器，并显示正在交换的 JSON-RPC 消息。

运行 Inspector

npx @modelcontextprotocol/inspector node ./build/index.js

检查器启动并连接到你的服务器后，如果你访问本地主机的 URL，就可以与之交互：

1. 连接：你会看到initialize消息，确认连接成功。
2. 列出工具：使用检查器界面询问服务器提供哪些工具，你应该只会看到我们的hello_world工具。
3. 列出资源 / 提示：如果你尝试访问资源或提示选项卡，它们应该是不可点击的，因为我们注释掉了它们的注册。
4. 调用工具：使用检查器调用hello_world工具，你应该会看到服务器用我们的自定义消息进行响应。

MCP Inspector 是你开发过程中的得力助手。在你添加或修改任何功能（工具、资源或提示）之后，都要用它来验证服务器是否正确注册了该功能，并且响应是否符合预期。使用检查器，你无需完整的 AI 客户端就能测试服务器功能。

记住，无论你进行到哪一步，都要使用 MCP Inspector。

那么，如何系统的去学习大模型LLM？

作为一名从业五年的资深大模型算法工程师，我经常会收到一些评论和私信，我是小白，学习大模型该从哪里入手呢？我自学没有方向怎么办？这个地方我不会啊。如果你也有类似的经历，一定要继续看下去！这些问题啊，也不是三言两语啊就能讲明白的。

所以我综合了大模型的所有知识点，给大家带来一套全网最全最细的大模型零基础教程。在做这套教程之前呢，我就曾放空大脑，以一个大模型小白的角度去重新解析它，采用基础知识和实战项目相结合的教学方式，历时3个月，终于完成了这样的课程，让你真正体会到什么是每一秒都在疯狂输出知识点。

由于篇幅有限，⚡️ 朋友们如果有需要全套 《2025全新制作的大模型全套资料》，扫码获取~

👉大模型学习指南+路线汇总👈

我们这套大模型资料呢，会从基础篇、进阶篇和项目实战篇等三大方面来讲解。

👉①.基础篇👈

基础篇里面包括了Python快速入门、AI开发环境搭建及提示词工程，带你学习大模型核心原理、prompt使用技巧、Transformer架构和预训练、SFT、RLHF等一些基础概念，用最易懂的方式带你入门大模型。

👉②.进阶篇👈

接下来是进阶篇，你将掌握RAG、Agent、Langchain、大模型微调和私有化部署，学习如何构建外挂知识库并和自己的企业相结合，学习如何使用langchain框架提高开发效率和代码质量、学习如何选择合适的基座模型并进行数据集的收集预处理以及具体的模型微调等等。

👉③.实战篇👈

实战篇会手把手带着大家练习企业级的落地项目（已脱敏），比如RAG医疗问答系统、Agent智能电商客服系统、数字人项目实战、教育行业智能助教等等，从而帮助大家更好的应对大模型时代的挑战。

👉④.福利篇👈

最后呢，会给大家一个小福利，课程视频中的所有素材，有搭建AI开发环境资料包，还有学习计划表，几十上百G素材、电子书和课件等等，只要你能想到的素材，我这里几乎都有。我已经全部上传到CSDN，朋友们如果需要可以微信扫描下方CSDN官方认证二维码免费领取【保证100%免费】

相信我，这套大模型系统教程将会是全网最齐全 最易懂的小白专用课！！