npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2026 – Pkg Stats / Ryan Hefner

asiainfo-figmamcp-server-proxy

v1.0.1

Published

MCP Server built with Node.js

Readme

Figma MCP Server

一个基于Node.js的Model Context Protocol (MCP) 服务器实现。

功能特性

  • ✅ 工具(Tools)支持
  • ✅ 资源(Resources)支持
  • ✅ 提示(Prompts)支持
  • ✅ 使用标准输入/输出进行通信

安装

npm install

运行

npm start

开发模式(自动重启):

npm run dev

调试

使用 MCP Inspector 进行调试:

npm run inspect

或者直接使用 npx:

npx @modelcontextprotocol/inspector node src/index.js

Inspector 会在浏览器中打开 http://localhost:5173,你可以:

  • 查看和测试所有工具
  • 检查资源
  • 测试提示模板
  • 查看服务器日志和通知

详细调试指南请查看 DEBUG.md

在 Cursor 中使用

1. 找到 Cursor 的 MCP 配置文件

Cursor 的 MCP 配置文件位置:

  • Windows: %APPDATA%\Cursor\User\globalStorage\saoudrizwan.claude-dev\settings\cline_mcp_settings.json
  • macOS: ~/Library/Application Support/Cursor/User/globalStorage/saoudrizwan.claude-dev/settings/cline_mcp_settings.json
  • Linux: ~/.config/Cursor/User/globalStorage/saoudrizwan.claude-dev/settings/cline_mcp_settings.json

或者通过 Cursor 设置:

  1. 打开 Cursor 设置(Ctrl+,Cmd+,
  2. 搜索 "MCP" 或 "Model Context Protocol"
  3. 找到 MCP 服务器配置选项

2. 配置 MCP 服务器

在配置文件中添加以下内容(如果文件不存在,请创建它):

{
  "mcpServers": {
    "figmamcp": {
      "command": "npx",
      "args": ["-y", "@dongqs/figmamcp-server@latest"],
      "env": { "MCP_URL": "http://127.0.0.1:3845/mcp" }
    }
  }
}

说明:

  • 采用 npx 方式,Cursor 启动时自动下载/缓存包并执行,无需全局安装。
  • 如需指定版本可改为 @dongqs/[email protected]
  • MCP_URL 指定要代理的 HTTP MCP 服务地址(默认:http://127.0.0.1:3845/mcp)。

3. 配置说明

基本配置

{
  "mcpServers": {
    "figmamcp": {
      "command": "npx",
      "args": ["-y", "@dongqs/figmamcp-server@latest"]
    }
  }
}

自定义 HTTP MCP 服务地址

如果你想连接到不同的 HTTP MCP 服务,可以通过环境变量配置:

{
  "mcpServers": {
    "figmamcp": {
      "command": "npx",
      "args": ["-y", "@dongqs/figmamcp-server@latest"],
      "env": {
        "MCP_URL": "http://localhost:4002/mcp"
      }
    }
  }
}

4. 重启 Cursor

配置完成后,重启 Cursor 以使配置生效。

5. 验证配置

重启后,在 Cursor 中:

  1. 打开聊天面板
  2. 尝试使用 MCP 工具
  3. 如果配置成功,你应该能看到从 http://127.0.0.1:3845/mcp 获取的工具列表

注意: MCP 服务器会在启动时自动预加载工具列表,如果 HTTP MCP 服务在 Cursor 启动时还未准备好,工具列表可能会延迟几秒加载。这是正常现象,服务器会自动重试。

6. 故障排除

如果工具无法使用,请检查:

  1. Node.js 已安装

    node --version  # 应该 >= 18
  2. 项目依赖已安装

    cd /path/to/figmamcp
    npm install
  3. 路径正确:确保配置中的路径是绝对路径且文件存在

  4. HTTP MCP 服务运行中:确保 http://127.0.0.1:3845/mcp 服务正在运行

    # 使用诊断工具检查
    npm run diagnose
  5. 工具自动加载

    • MCP 服务器会在启动时自动预加载工具列表(带重试机制)
    • 如果打开 Cursor 时工具未立即显示,等待几秒后应该会自动加载
    • 也可以在聊天中尝试使用工具,这会触发工具列表的刷新
  6. 查看 Cursor 日志

    • 打开 Cursor 开发者工具(Ctrl+Shift+ICmd+Option+I
    • 查看控制台中的错误信息
    • 查找 [MCP] 开头的日志,了解工具加载状态

7. 工作原理

这个 MCP 服务器作为代理/网关

  • 接收来自 Cursor 的工具请求
  • 转发到配置的 HTTP MCP 服务(http://127.0.0.1:3845/mcp
  • 返回结果给 Cursor

这意味着 Cursor 可以通过 stdio 方式使用任何 HTTP MCP 服务。

可用工具

echo

回显输入的文本

参数:

  • text (string, 必需): 要回显的文本

add

计算两个数字的和

参数:

  • a (number, 必需): 第一个数字
  • b (number, 必需): 第二个数字

list_external_tools

连接外部 MCP 服务并获取其提供的工具列表(支持 stdio 和 HTTP 两种方式)

参数(任选其一):

  • stdio 模式:
    • command (string, 必需): 启动外部 MCP 服务器的命令,例如 node / python
    • args (string[], 可选): 命令参数,例如 ["path/to/server.js"]
  • HTTP 模式:
    • url (string, 必需): 外部 MCP HTTP 服务地址,例如 http://localhost:4002/mcp

call_external_tool

调用外部 MCP 服务中的某个工具(支持 stdio 和 HTTP 两种方式)

参数(任选其一):

  • stdio 模式:
    • command (string, 必需): 启动外部 MCP 服务器的命令,例如 node / python
    • args (string[], 可选): 命令参数,例如 ["path/to/server.js"]
    • toolName (string, 必需): 外部 MCP 服务中要调用的工具名称
    • toolArgs (object, 可选): 传递给外部工具的参数对象
  • HTTP 模式:
    • url (string, 必需): 外部 MCP HTTP 服务地址,例如 http://localhost:4002/mcp
    • toolName (string, 必需): 外部 MCP 服务中要调用的工具名称
    • toolArgs (object, 可选): 传递给外部工具的参数对象

可用资源

example://resource1

示例文本资源

example://resource2

示例JSON资源

可用提示

greeting

生成问候语

参数:

  • name (string, 必需): 要问候的人的名字

code_review

代码审查提示

参数:

  • code (string, 必需): 要审查的代码

开发

项目使用ES模块(ESM),确保Node.js版本 >= 18。

作为 MCP 客户端使用

项目中提供了一个简单的 MCP 客户端封装(src/mcpClient.js),用于通过 stdio 或 HTTP 方式连接其它 MCP 服务:

  • createMcpClient({ command, args?, url?, name? }):根据参数选择 stdio 或 HTTP,创建并连接到外部 MCP 服务,返回 McpClient 实例
  • createStdioMcpClient({ command, args?, name? }):仅 stdio 的兼容封装
  • listExternalTools({ command, args?, url? }):列出外部 MCP 服务的工具
  • callExternalTool({ command, args?, url?, toolName, toolArgs? }):调用外部 MCP 服务中的工具

示例(直接作为库使用):

import { listExternalTools, callExternalTool } from './src/mcpClient.js';

// 列出外部 MCP 服务工具(stdio 模式)
const tools = await listExternalTools({
  command: 'node',
  args: ['path/to/other-mcp-server.js'],
});

// 或者通过 HTTP 模式
const httpTools = await listExternalTools({
  url: 'http://localhost:4002/mcp',
});

// 调用外部 MCP 服务中的某个工具(stdio 模式)
const result = await callExternalTool({
  command: 'node',
  args: ['path/to/other-mcp-server.js'],
  toolName: 'echo',
  toolArgs: { text: 'hello from figmamcp client' },
});

// 调用外部 MCP 服务中的某个工具(HTTP 模式)
const httpResult = await callExternalTool({
  url: 'http://localhost:4002/mcp',
  toolName: 'echo',
  toolArgs: { text: 'hello from figmamcp client via http' },
});
console.log(result);

许可证

MIT