hinanyin/mcp-server

Narwal MCP Server Clone

一个基于 TypeScript 的 MCP (Model Context Protocol) 服务器克隆，提供与原始 narwal-mcp-server 相同的功能。

🚀 功能特性

• 组件文档查询 - 获取 React 组件的详细文档和使用示例
• 文章搜索 - 在文档站点中进行全文搜索
• 规则管理 - 获取开发规则和最佳实践
• TypeScript 支持 - 完整的类型安全和现代开发体验

📦 安装和构建

# 安装依赖
npm install

# 构建项目
npm run build

# 启动服务器
npm start

⚙️ Cursor 配置

在 ~/.cursor/mcp.json 中添加以下配置：

{
  "mcpServers": {
    "narwal-components": {
      "command": "node", 
      "args": ["D:\\forward\\cursorMcp\\narwal-mcp-server-clone\\dist\\index.js"],
      "cwd": "D:\\forward\\cursorMcp\\narwal-mcp-server-clone"
    }
  }
}

重要: args 中必须使用绝对路径！

🛠️ 可用工具

组件相关

• get_component_doc - 获取指定组件的文档内容
• get_all_components - 获取所有可用的组件列表

文档搜索

• list_articles - 列出文档站点的所有文章
• search_articles - 根据关键词搜索文章
• get_article - 获取特定文章的完整内容

规则管理

• get_all_rules - 获取所有可用的规则列表
• get_rule_content - 获取指定规则文件的完整内容

🧪 使用示例

获取组件文档

获取 ActionButton 组件的详细文档

搜索组件

搜索包含 "Button" 的组件文档

列出所有组件

获取所有可用的组件列表

📁 项目结构

narwal-mcp-server-clone/
├── src/                    # TypeScript 源代码
│   ├── index.ts           # 主服务器文件
│   └── data/              # 模拟数据
├── dist/                  # 编译后的 JavaScript
├── package.json           # 项目配置
└── tsconfig.json          # TypeScript 配置

🔧 开发

# 开发模式（监听文件变化）
npm run dev

# 运行测试
npm test

📝 注意事项

1. 重启 Cursor: 修改配置后需要完全重启 Cursor
2. 绝对路径: MCP 配置中的 args 必须使用绝对路径
3. 等待连接: 启动后需要等待 30-60 秒让服务连接

🎯 成功标志

当一切正常时，你应该能够：

• 在 Cursor 中看到 narwal-components 服务已连接
• 使用自然语言调用组件文档查询功能
• 获得格式化的组件信息和使用示例