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

figma-developer-mcp-caching-dev-fork

v0.9.0

Published

Dev fork of Framelink's Figma MCP server with persistent caching until upstream merge.

Readme

使用此 Model Context Protocol 伺服器,讓 Cursor 和其他由 AI 驅動的程式碼工具存取您的 Figma 檔案。

當 Cursor 可以存取 Figma 設計資料時,它在一次性精準實現設計方面,比貼上螢幕截圖等替代方案好得多

示範

觀看在 Cursor 中使用 Figma 設計資料建構 UI 的示範

觀看影片

運作方式

  1. 開啟您 IDE 的聊天功能(例如 Cursor 中的代理模式)。
  2. 貼上 Figma 檔案、框架或群組的連結。
  3. 要求 Cursor 對 Figma 檔案執行操作 — 例如,實現設計。
  4. Cursor 將從 Figma 取得相關元數據,並用它來編寫您的程式碼。

此 MCP 伺服器專為與 Cursor 搭配使用而設計。在從 Figma API 回應內容之前,它會簡化和轉譯回應,以便只向模型提供最相關的版面配置和樣式資訊。

減少提供給模型的內容有助於提高 AI 的準確性並使回應更具關聯性。

入門指南

許多程式碼編輯器和其他 AI 客戶端都使用設定檔來管理 MCP 伺服器。

此快取分叉(以 figma-developer-mcp-caching-dev-fork 發布)可透過在設定檔加入以下內容來設定。

注意:您需要建立一個 Figma 存取權杖才能使用此伺服器。有關如何建立 Figma API 存取權杖的說明,請參閱此處

MacOS / Linux

{
  "mcpServers": {
    "Framelink MCP for Figma": {
      "command": "npx",
      "args": ["-y", "figma-developer-mcp-caching-dev-fork", "--figma-api-key=YOUR-KEY", "--stdio"]
    }
  }
}

Windows

{
  "mcpServers": {
    "Framelink MCP for Figma": {
      "command": "cmd",
      "args": ["/c", "npx", "-y", "figma-developer-mcp-caching-dev-fork", "--figma-api-key=YOUR-KEY", "--stdio"]
    }
  }
}

如果您希望依照 MCP 客戶端規範以環境變數管理憑證(建議),請將其放在伺服器定義旁的 env 物件中。以下為 Cursor 設定範例:

{
  "mcpServers": {
    "Framelink MCP for Figma": {
      "command": "npx",
      "args": ["-y", "figma-developer-mcp-caching-dev-fork", "--stdio"],
      "env": {
        "FIGMA_API_KEY": "YOUR-KEY",
        "FIGMA_CACHING": "{\"ttl\":{\"value\":30,\"unit\":\"d\"}}",
        "PORT": "3333"
      }
    }
  }
}

如果您需要有關如何設定 Framelink MCP for Figma 伺服器的更多資訊,請參閱 Framelink 文件

Support for free Figma accounts: Persistent caching (optional)

為避免觸發 Figma 嚴格的速率限制,可以透過 JSON FIGMA_CACHING 環境變數啟用磁碟快取。

FIGMA_CACHING='{ "ttl": { "value": 30, "unit": "d" } }'
  • cacheDir(可選)控制快取檔案的寫入位置。相對路徑以當前工作目錄為基準,~ 會展開到家目錄。預設:Linux ~/.cache/figma-mcp、macOS ~/Library/Caches/FigmaMcp、Windows %LOCALAPPDATA%/FigmaMcpCache
  • ttl 控制快取有效期,必須包含 value(數字)與 unitms/s/m/h/d)。

啟用快取後,伺服器會先抓取完整 Figma 檔案並寫入磁碟,後續 get_figma_data / get_raw_node 請求會在到期前直接返回快取。若需強制重新整理,刪除 cacheDir 內的檔案即可。不設定 FIGMA_CACHING 則維持預設的非快取行為。

了解更多

Framelink MCP for Figma 伺服器既簡單又強大。請前往 Framelink 網站了解更多資訊,以充分利用它。