把 MCP Server 打包进 VS Code extension

 更新时间:2025年05月01日 11:31:18   作者:formulahendry  
文章介绍了如何将MCPServer打包进VSCode extension,使得用户可以在VSCode中直接安装和运行MCPServer,而无需额外配置和工具

大家好!我是韩老师。

写在最前:如果你正好在用 Node.js 开发一个 MCP Server,那么,这篇文章将对你有用!

WHY

首先,你肯定要问,把 MCP Server 打包进 VS Code extension,有什么好处?

好处,有三:

在 VS Code 中,用户不需要任何配置,就可以直接安装 MCP Server。 用户不需要安装任何额外的工具来运行 MCP Server。甚至于,用户不需要安装 Node.js/npx。 整个 MCP Server + VS Code extension 的体积很小。以我的 Code Runner MCP Server 的 VS Code extension 为例,在没有使用 webpack 的情况下,整个体积都只有 4 MB。

HOW

你肯定想要知道,如何做到?

其实,很简单,三步就能搞定!

1. 在你的 MCP Server 中,export 一个启动 Streamable Http MCP Server 的函数:

export async function startMcpServer(transport: Transport, options?: HttpServerOptions): Promise<void | McpServerEndpoint> {
    if (transport === 'stdio') {
        return startStdioMcpServer();
    } else if (transport === 'http') {
        return startStreamableHttpMcpServer(options?.port);
    } else {
        throw new Error('Invalid transport. Must be either "stdio" or "http"');
    }
}

2. 在 VS Code extension 中,引用你的 MCP Server 的 npm,然后启动 Streamable Http MCP Server,然后得到一个 localhost 的 MCP URL:

import { startMcpServer } from "mcp-server-code-runner";

async function startHttpMcpServer(): Promise<string | undefined> {
    const result = await startMcpServer("http", { port: 3098 });

    return result ? result.url : undefined;
}

3. 把这个 localhost 的 MCP URL,配置到 VS Code 的 settings.json 中:

async function updateMcpUrlToVsCodeSettings(mcpUrl: string) {
    const configuration = vscode.workspace.getConfiguration();
    const mcpServers = configuration.get<any>("mcp.servers", {});
    mcpServers["code-runner-streamable-http-mcp-server"] = {
        type: "http",
        url: mcpUrl,
    };
    await configuration.update("mcp.servers", mcpServers, vscode.ConfigurationTarget.Global);
}

好了,大功告成!

原理其实也很简单:因为 VS Code extension,就是一个 Node.js 的程序。MCP Server 作为 VS Code extension 的一部分,一起运行在了 Extension Host 这个进程中。所以,不需要用户的机器上额外安装 Node.js/npx 了!

完整代码,完全开源,欢迎大家围观!

MCP Server:

https://github.com/formulahendry/mcp-server-code-runner

VS Code extension:

https://github.com/formulahendry/vscode-code-runner-mcp-server

大家也可以也可以在 VS Code Marketplace 搜索 Code Runner MCP Server 来直接试用:

注意需要使用最新的 VS Code Insider,版本号 >= 1.100

https://marketplace.visualstudio.com/items?itemName=formulahendry.code-runner-mcp-server

到此这篇关于把 MCP Server 打包进 VS Code extension的文章就介绍到这了,更多相关MCP Server 打包进 VS Code扩展内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • 轻松创建nodejs服务器(9):实现非阻塞操作

    轻松创建nodejs服务器(9):实现非阻塞操作

    这篇文章主要介绍了轻松创建nodejs服务器(9):实现非阻塞操作,本系列文章会教你一步一步创建一个完整的服务器,要的朋友可以参考下
    2014-12-12
  • Node.js基础入门之path模块,url模块,http模块使用详解

    Node.js基础入门之path模块,url模块,http模块使用详解

    这篇文章主要为大家介绍了Node.js中的三个模块(path、url、http)的使用详解,文中的示例代码讲解详细,感兴趣的小伙伴可以了解一下
    2022-03-03
  • node.js卸载并重新安装的方法步骤

    node.js卸载并重新安装的方法步骤

    本文详细介绍了Node.js的卸载和重新安装步骤,包括进入控制面板卸载程序,手动删除文件夹,清理环境变量,以及如何重新下载并安装Node.js,提供了详细的操作指导和安装Node.js的官方下载地址,确保用户能够顺利完成Node.js的更新或重装过程,感兴趣的可以了解一下
    2024-11-11
  • Node.js安装教程和NPM包管理器使用详解

    Node.js安装教程和NPM包管理器使用详解

    这篇文章主要介绍了Node.js安装教程和NPM包管理器使用详解,安装部分讲解了Windows、和MAC OS下的安装图解,并介绍了Linux下的源码安装方法,最后对NPM包管理器做了详细介绍,需要的朋友可以参考下
    2014-08-08
  • Nodejs搭建多进程Web服务器实现过程

    Nodejs搭建多进程Web服务器实现过程

    这篇文章主要为大家介绍了Nodejs搭建多进程Web服务器实现过程详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-10-10
  • 基于npm install或run时一些报错的解决方案

    基于npm install或run时一些报错的解决方案

    这篇文章主要介绍了基于npm install或run时一些报错的解决方案,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2023-06-06
  • nodejs检测因特网是否断开的解决方案

    nodejs检测因特网是否断开的解决方案

    这篇文章主要给大家介绍了关于nodejs如何检测因特网是否断开的相关资料,文中通过示例代码介绍的非常详细,对大家学习或者使用nodejs具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧
    2019-04-04
  • nodejs和npm升级实现过程

    nodejs和npm升级实现过程

    这篇文章主要介绍了nodejs和npm升级实现过程,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2025-08-08
  • node.js中的http.createServer方法使用说明

    node.js中的http.createServer方法使用说明

    这篇文章主要介绍了node.js中的http.createServer方法使用说明,本文介绍了http.createServer的方法说明、语法、接收参数、使用实例和实现源码,需要的朋友可以参考下
    2014-12-12
  • Node.js安装、环境变量配置、报错解决方法

    Node.js安装、环境变量配置、报错解决方法

    Node.js 是一个基于 Chrome JavaScript 运行时建立的一个平台,这篇文章主要介绍了Node.js安装、环境变量配置、报错解决方法,需要的朋友可以参考下
    2022-06-06

最新评论