MCP 工具文档

一个 VSCode/Cursor 扩展，提供集成的 MCP 服务器和 UI 面板，用于检索和显示命令行工具的文档。该扩展会自动检测工作区中的工具，并通过 WebView 面板提供其文档。

核心功能

• 🔄 内置 MCP 服务器

  • Express + SSE 服务器（端口 54321-54421）
  • 安全来源验证
  • 自动端口选择
  • 连接管理和清理
  • 实时事件流

• 🔍 工具发现

  • 包脚本 (npm, yarn, pnpm)
  • 本地二进制文件 (node_modules/.bin)
  • 全局工具 (git, npm, yarn, pnpm)
  • Monorepo 工作区支持

• 📚 文档检索

  • 帮助命令执行 (-h, --help)
  • 版本信息获取
  • 安全命令验证
  • 错误处理

• 💻 VS Code 集成

  • 基于 React 的 WebView 面板
  • 状态栏集成
  • 命令面板支持
  • 工作区路径检测

架构

1. VS Code 扩展 (后端)

扩展主机 (src/extension.ts)
├── VS Code 启动时激活
├── 创建 MCP 服务器
│   └── Express + SSE 服务器 (54321-54421 端口范围)
└── 创建 WebView 面板

2. MCP 服务器 (中间层)

MCP 服务器 (src/server/*)
├── SSE 事件流
│   ├── 实时工具发现更新
│   ├── 文档流
│   └── 连接状态管理
│
└── 工具发现系统
    ├── path-scanner.ts
    │   └── 在工作区中查找工具 (bin/, node_modules/.bin)
    └── package-scanner.ts
        └── 扫描 package.json 以查找可用工具

3. WebView 面板 (前端)

React WebView (src/panel/*)
├── UI 组件
│   └── 显示可用工具及其文档
│
└── SSE 客户端
    ├── 请求可用工具
    └── 流式传输工具文档

项目结构

my-tools-mcp/
├── src/                      # 源代码
│   ├── extension.ts          # 扩展入口点
│   ├── env.ts               # 环境配置
│   ├── server/              # 内置 MCP 服务器
│   │   ├── index.ts         # 服务器设置和 SSE 处理
│   │   └── controllers/     # 工具发现和执行
│   │       ├── docs/        # 文档控制器
│   │       ├── path-scanner.ts    # 工具发现
│   │       └── package-scanner.ts # Package.json 扫描
│   ├── panel/              # WebView UI (React)
│   │   ├── index.tsx      # WebView 入口点
│   │   ├── App.tsx        # 主要 React 组件
│   │   └── components/    # UI 组件
│   ├── types/             # 共享 TypeScript 类型
│   └── lib/               # 共享实用程序
├── dist/                  # 编译输出
└── src/__tests__/        # 测试文件

开发设置

1. 安装依赖:

pnpm install

2. 启动开发:

# 在 watch 模式下启动 webpack
pnpm run dev

# 或者构建用于生产
pnpm run build

3. 启动扩展:

• 在 VSCode 中按 F5 开始调试
• 扩展将启动 MCP 服务器和 WebView 面板

用法

1. 打开命令面板 (Cmd/Ctrl + Shift + P)
2. 输入 "MCP Tools" 并选择该命令
3. WebView 面板将打开并显示可用工具
4. 选择一个工具以查看其文档

技术细节

工具发现

• 包脚本

  • 自动检测 npm/yarn/pnpm 脚本
  • 显示脚本源和工作目录
  • 支持 monorepo 工作区
  • 验证脚本是否存在

• 二进制工具

  • 在 node_modules/.bin 中查找工具
  • 检测全局工具 (git, npm, yarn, pnpm)
  • 验证工具是否存在和权限
  • 处理路径解析

文档检索

• 执行帮助命令 (-h, --help)
• 获取版本信息
• 处理命令执行错误
• 验证工具名称和参数
• 实现适当的超时

SSE 通信

• 实时工具发现更新
• 安全来源验证
• 连接管理和清理
• 错误处理和报告
• 自动重新连接支持
• 基于事件的流
• 双向消息传递

安全特性

• 工具名称验证
• 命令注入预防
• SSE 连接的来源验证
• 适当的错误处理和报告
• 资源清理
• 连接状态管理

测试

该扩展包括全面的测试：

• 服务器功能的集成测试
• VS Code 扩展测试
• 工具发现测试
• 安全验证测试
• SSE 通信测试

许可证

ISC