Rxjs Mcp Server

RxJS MCP 服务

日文版 README 请见此处

⚠️ 这是一个非官方社区项目，与 RxJS 团队无关。

直接通过 Claude 等 AI 助手执行、调试和可视化 RxJS 流。

功能特性

🚀 流执行

• 执行 RxJS 代码并捕获发射的数据
• 使用时间戳可视化时间线
• 跟踪内存使用情况
• 支持所有主要的 RxJS 操作符

📊 弹珠图

• 生成 ASCII 弹珠图
• 可视化流随时间的行为
• 自动检测模式
• 提供清晰的图例和说明

🔍 操作符分析

• 分析操作符链的性能
• 检测潜在问题和瓶颈
• 建议替代方案
• 按功能对操作符进行分类

🛡️ 内存泄漏检测

• 识别未取消订阅的订阅
• 检测缺失的清理模式
• 提供框架专属建议（Angular、React、Vue）
• 提供正确的清理示例

💡 模式建议

• 获取经过实战验证的 RxJS 模式
• 提供框架专属实现
• 涵盖常见用例：
  • 带退避机制的 HTTP 重试
  • 搜索自动补全
  • WebSocket 重新连接
  • 表单验证
  • 状态管理
  • 以及更多……

安装

要求

• Node.js >= 22（engines.node）。本服务基于 MCP TypeScript SDK v2 构建，该 SDK 要求 Node.js >= 20；本软件包将最低版本设得更高，以继续使用受维护的 LTS 版本。

# Install globally
npm install -g @shuji-bonji/rxjs-mcp

# Or use with npx
npx @shuji-bonji/rxjs-mcp

配置

Claude Desktop

添加到 ~/Library/Application Support/Claude/claude_desktop_config.json：

{
  "mcpServers": {
    "rxjs": {
      "command": "npx",
      "args": ["@shuji-bonji/rxjs-mcp"]
    }
  }
}

使用 Continue/Copilot 的 VS Code

添加到 .vscode/mcp.json：

{
  "mcpServers": {
    "rxjs": {
      "command": "npx",
      "args": ["@shuji-bonji/rxjs-mcp"]
    }
  }
}

Cursor

添加到 ~/.cursor/mcp.json：

{
  "mcpServers": {
    "rxjs": {
      "command": "npx",
      "args": ["@shuji-bonji/rxjs-mcp"]
    }
  }
}

可用工具

execute_stream

执行 RxJS 代码并捕获流发射的数据，同时生成时间线。

该工具接受能计算出 Observable 的表达式，或以此类表达式结尾的代码片段——return 可省略。

// ✅ Trailing expression (v0.2.0+): the last expression is returned implicitly
interval(100).pipe(
  take(5),
  map((x) => x * 2),
);

// ✅ Declaration + trailing reference
const stream$ = interval(100).pipe(
  take(5),
  map((x) => x * 2),
);
stream$;

// ✅ Explicit return (always works)
return interval(100).pipe(
  take(5),
  map((x) => x * 2),
);

generate_marble

根据事件数据生成 ASCII 弹珠图。

// Input: array of timed events
[
  { time: 0, value: 'A' },
  { time: 50, value: 'B' },
  { time: 100, value: 'C' },
];

// Output: A----B----C--|

analyze_operators

分析 RxJS 操作符链的性能和最佳实践。

// Analyzes chains like:
source$.pipe(
  map((x) => x * 2),
  filter((x) => x > 10),
  switchMap((x) => fetchData(x)),
  retry(3),
);

detect_memory_leak

检测潜在的内存泄漏和缺失的清理操作。

// Detects issues like:
- Missing unsubscribe
- No takeUntil operator
- Uncompleted Subjects
- Infinite intervals

suggest_pattern

获取适用于常见用例的生产级模式。

可用模式：

• http-retry - 支持重试的弹性 HTTP
• search-typeahead - 防抖搜索
• polling - 带退避策略的智能轮询
• websocket-reconnect - 自动重连的 WebSocket
• form-validation - 响应式表单验证
• state-management - 简易状态存储
• cache-refresh - 带刷新策略的缓存
• 还有更多……

lint_rxjs

检查 RxJS 代码片段中的常见问题和最佳实践。基于 eslint-plugin-rxjs-x 规则。

// Parameters:
{
  code: string;           // RxJS code to lint
  config?: 'recommended' | 'strict';  // Rule set (default: recommended)
  framework?: 'angular' | 'react' | 'vue' | 'none'; // Framework context
  rules?: string[];       // Specific rules to check (overrides config)
}

配置级别：

• recommended — 包含 20 条规则，涵盖最常见的问题
• strict — eslint-plugin-rxjs-x 的 strict 中的 28 条规则（no-exposed-subjects、no-misused-observables、no-unnecessary-collection 等）

与该插件保持一致，finnish 不属于这两个配置，只有在指定时才会运行： rules: ["finnish"]。两个级别都会额外应用框架专属检查。

框架专属检查：

• Angular — 检测组件中是否缺少 takeUntilDestroyed() 或 takeUntil(destroy$)
• React — 检测 subscribe() 是否未进行 useEffect 清理
• Vue — 检测 subscribe() 是否未进行 onUnmounted 清理

使用示例

使用 Claude

User: "Execute this RxJS stream and show me the output"

Claude: I'll execute that RxJS stream for you.

[Uses execute_stream tool]

## Stream Execution Result
✅ Completed
Execution Time: 523ms
Values Emitted: 5

### Emitted Values
[0, 2, 4, 6, 8]

调试内存泄漏

User: "Check this Angular component for memory leaks"

Claude: I'll analyze your component for potential memory leaks.

[Uses detect_memory_leak tool]

## Memory Leak Analysis
⚠️ Potential leaks detected

1. 🔴 subscription (high severity)
   - Found 3 subscribe() calls but only 1 unsubscribe()
   - Fix: Use takeUntil pattern with destroy$ subject

获取模式

User: "Show me how to implement search with RxJS"

Claude: I'll show you the search typeahead pattern.

[Uses suggest_pattern tool with useCase: 'search-typeahead']

## Search Typeahead with Debounce
[Full implementation with explanation]

安全性

execute_stream 工具会在隔离的 Worker 线程中运行用户提供的代码，以防止：

• 污染主进程
• 无限循环或计时器导致资源泄漏
• 访问敏感的 Node.js API（process、fs 等）

如果执行时间超过配置的超时时间，将强制终止执行。

开发

# Clone the repository
git clone https://github.com/shuji-bonji/rxjs-mcp-server
cd rxjs-mcp-server

# Install dependencies
npm install

# Build
npm run build

# Run tests
npm test              # Unit tests (vitest)
npm run test:mcp      # MCP integration test
npm run test:inspector # MCP Inspector (GUI)

# Run in development
npm run dev

发布

发布通过 GitHub Actions 自动完成，并使用 Trusted Publisher (OIDC) 发布到 npm — 不使用静态令牌，且每次发布都会附带 npm 来源证明。完整工作流（以及 npm 初始设置）请参阅 RELEASING.md。

与其他 MCP 服务集成

RxJS MCP Server 可与以下服务协同使用：

• Angular MCP - 用于 Angular 项目脚手架搭建
• TypeScript MCP - 用于类型检查
• ESLint MCP - 用于代码质量检查

未来的 Meta-MCP 集成将支持这些工具之间的无缝协作。

架构

┌─────────────────┐
│   AI Assistant  │
│   (Claude, etc) │
└────────┬────────┘
         │
    MCP Protocol
         │
┌────────┴────────┐
│  RxJS MCP Server│
├─────────────────┤
│ • execute_stream│
│ • generate_marble│
│ • analyze_operators│
│ • detect_memory_leak│
│ • suggest_pattern│
│ • lint_rxjs      │
└─────────────────┘

该服务基于 MCP TypeScript SDK v2 （@modelcontextprotocol/server@^2.0.0，协议修订版本 2026-07-28）构建。它仅支持 stdio：src/index.ts 会将 src/server.ts 中的 createServer() 工厂传递给 serveStdio()，后者也支持仍使用 2025 协议修订版本的客户端。

文档参考系统

从 v0.3.0 开始，analyze_operators 会为每个运算符和创建函数输出三级文档链接：

级别	来源	用途	AI 可读？
官方	rxjs.dev	面向用户的权威 API 参考	❌（SPA）
源码	GitHub（标签 7.8.2）	JSDoc 和实现——为 AI 提供最丰富的上下文	✅
指南	RxJS-with-TypeScript	日英双语说明及实用示例	✅

为什么要在官方文档之外提供社区指南？

1. rxjs.dev 是一个客户端渲染的 SPA。 AI 助手无法获取其内容——HTTP 请求返回的只是一个带有 JavaScript 加载器的空壳。因此，官方网站只是一个“提供给人类的链接”，而不是 AI 能读取的资料来源。

2. GitHub 源码提供了未经加工的事实。 RxJS 源代码（固定在标签 7.8.2）包含 JSDoc、类型签名和实现细节。这是 AI 助手的主要参考资料。

3. 双语指南补充了学习背景。 它按使用场景（而非仅按字母顺序）整理操作符，提供可运行的示例，并附有日语翻译。对于日语用户或学习者来说，这弥补了 rxjs.dev 和原始源码都未能解决的空缺。

优先级顺序

MCP 服务输出参考链接时，遵循以下优先级：

1. officialUrl — 始终显示（权威、便于人类阅读）
2. sourceUrl — 有时显示（AI 应读取此链接）
3. guideUrl — 页面存在时显示（补充资料）

如果某个操作符尚无对应的指南页面，则会直接省略该字段（不会产生失效链接）。覆盖情况由 URL 验证 CI 跟踪。

可以禁用指南参考链接吗？

目前没有运行时选项可将 guideUrl 从输出中排除。如果你只想使用官方参考链接，可以复刻此服务或提交功能请求。未来版本可能会支持 --references=official,source 标志。

贡献

欢迎贡献！请随时提交 PR。

许可证

MIT

作者

Shuji Bonji

链接

• GitHub 仓库
• RxJS 文档
• Model Context Protocol