内容
<div align="center">
# MCP 工作室
### 构建 MCP（模型上下文协议）服务器的完整工具包
[](LICENSE)
[](https://www.typescriptlang.org/)
[](CONTRIBUTING.md)
[](https://github.com/namangoyal3/mcp-studio)
**构建 · 开发 · 检查 · 部署** — 您需要的一切来构建可投入生产的 MCP 服务器。
[快速入门](#-快速入门) • [文档](docs/) • [示例](examples/) • [贡献](CONTRIBUTING.md)
</div>
---
## 🎯 什么是 MCP 工作室？
**MCP 工作室**是一个开源工具包，可以轻松地**构建、测试和调试** [MCP（模型上下文协议）](https://modelcontextprotocol.io) 服务器。
> **MCP** 是开放标准，允许 Claude 等 AI 模型连接到您的工具、数据库、文件和 API — 可以将其视为“AI 的 USB-C 端口”。
MCP 工作室为您提供：
- ✅ **`mcp-studio init`** — 几秒钟内搭建完整的 MCP 服务器
- ✅ **`mcp-studio dev`** — 热重载开发服务器
- ✅ **`mcp-studio inspect`** — 调试和检查任何 MCP 服务器
- ✅ **`mcp-studio build`** — 带有 TypeScript 编译的生产构建
- ✅ **网页游乐场** — 交互式测试工具的可视化 UI
- ✅ **模板系统** — 从 `basic` 或 `tool-server` 模板开始
- ✅ **一流的 TypeScript** — 完整的类型安全性和严格模式
---
## 📸 预览
```
┌─ mcp-studio inspect "node dist/index.js" ──────────────────┐
│ │
│ ✔ 服务器在 124ms 内启动 │
│ ✔ 找到 3 个工具： │
│ │
│ greet │
│ 生成个性化问候 │
│ 参数：name:string*, style:string │
│ │
│ calculate │
│ 执行算术运算 │
│ 参数：a:number*, b:number*, operation:string* │
│ │
│ fetch_json │
│ 从 URL 获取 JSON 数据 │
│ 参数：url:string* │
│ │
│ ✔ 检查在 89ms 内完成 │
└─────────────────────────────────────────────────────────────┘
```
---
## 🚀 快速入门
### 1. 安装和搭建
```bash
# 克隆仓库
git clone https://github.com/namangoyal3/mcp-studio.git
cd mcp-studio
pnpm install && pnpm build
# 创建您的第一个 MCP 服务器
mcp-studio init my-weather-app
cd my-weather-app
```
### 2. 构建和运行
```bash
npm install
npm run build
npm start
```
### 3. 检查您的服务器
在另一个终端中：
```bash
mcp-studio inspect "node dist/index.js"
```
### 4. 连接到 Claude 代码
添加到您的 `~/.claude/servers.json`：
```json
{
"mcpServers": {
"my-server": {
"command": "node",
"args": ["path/to/my-server/dist/index.js"]
}
}
}
```
就这样！您的 AI 工具现在可以自动发现并调用您的工具。 🎉
---
## 🛠️ CLI 命令
| 命令 | 描述 | 示例 |
|---------|-------------|---------|
| `init` | 搭建新的 MCP 服务器 | `mcp-studio init my-server -t tool-server` |
| `dev` | 启动热重载 | `mcp-studio dev` |
| `build` | 编译 TypeScript | `mcp-studio build --outdir dist` |
| `inspect` | 调试正在运行的服务器 | `mcp-studio inspect "node dist/index.js"` |
### 选项
- `init --template basic|tool-server` — 选择模板
- `inspect --json` — 输出为 JSON
- `dev --port 3030` — 自定义游乐场端口
- `dev --no-watch` — 禁用文件监视
---
## 🎨 网页游乐场
MCP 工作室包含一个**漂亮的基于 Web 的游乐场**，用于可视化测试您的 MCP 服务器：
```bash
cd packages/playground
pnpm dev
```
在 `http://localhost:3030` 打开，并具有：
- 🔌 **连接面板** — 配置和连接到 MCP 服务器
- 🛠️ **交互式工具卡** — 使用自定义参数调用工具
- 📋 **实时控制台** — 所有活动的实时日志
- 🔄 **服务器状态指示器** — 知道您何时连接
---
## 📦 项目结构
```
mcp-studio/
├── packages/
│ ├── core/ # 📚 核心类型、服务器构建器、传输
│ ├── cli/ # ⌨️ CLI 工具（mcp-studio 命令）
│ ├── playground/ # 🎨 基于 Web 的游乐场（React + Vite）
│ └── templates/ # 📋 项目搭建模板
├── examples/
│ ├── weather-mcp/ # 🌤️ 天气数据 MCP 服务器
│ └── filesystem-mcp/ # 📁 只读文件系统 MCP 服务器
├── docs/ # 📖 文档
└── README.md
```
---
## 🌟 为什么选择 MCP 工作室？
### 对于 AI 开发者 🤖
为 Claude Code、Copilot、Cursor 和其他支持 MCP 的 AI 工具构建自定义工具集成。
### 对于 TypeScript 开发者 💙
完整的类型安全性和严格模式，以及一流的 TypeScript 支持。
### 对于开源贡献者 🤝
干净的架构、文档齐全的代码和简单的上手流程。
---
## 📚 了解更多
- [快速入门指南](docs/getting-started.md)
- [架构概述](docs/architecture.md)
- [API 参考](docs/api-reference.md)
- [MCP 规范](https://modelcontextprotocol.io)
- [示例服务器](examples/)
---
## 🤝 贡献
我们欢迎贡献！请参阅我们的 [贡献指南](CONTRIBUTING.md) 获取详细信息。
**贡献方式：**
- 🐛 通过 [问题](https://github.com/namangoyal3/mcp-studio/issues) 报告错误
- 💡 建议功能
- 📝 改进文档
- 🛠️ 提交拉取请求
---
## 📄 许可证
[MIT](LICENSE) © [Naman Goyal](https://github.com/namangoyal3)
---
<div align="center">
**用 ❤️ 为 MCP 生态系统构建**
⭐️ **如果您觉得它有用，请给这个仓库点赞！** ⭐️
</div>
