Figma MCP Server With Chunking

🚀 Figma MCP Server with Chunking Function

A Model Context Protocol (MCP) server that interacts with the Figma API, featuring built-in memory-efficient chunking and pagination capabilities, suitable for handling large files.

🚀 Quick Start

This documentation provides guidance on how to use the "Figma MCP Server with Chunking Function" (hereinafter referred to as the "server"), including installation, configuration, tool usage, memory management, and other related instructions.

✨ Features

• Interact with the Figma API.
• Built-in memory-efficient chunking and pagination for handling large files.
• Support for multiple configuration methods.
• Provide various tools for file data acquisition and listing.
• Implement memory management strategies and best practices.
• Offer debugging logs, error handling, and troubleshooting guidance.

📦 Installation

1. Install via Smithery

# Use the following command to install:
figma-mcp-server --install

2. Manual Installation (Optional)

# Clone the repository:
git clone https://github.com/your-repository.git
cd figma-mcp-server

# Install dependencies:
npm install

# Start the server:
node index.js

📚 Documentation

Configuration Guide

1. Environment Variable Configuration

Set the following environment variables to configure the server's behavior:

• FIGMA_ACCESS_TOKEN: Figma access token
• MAX_MEMORY_MB: Maximum allowed memory (in MB)
• DEFAULT_CHUNK_SIZE: Default chunk size (in nodes)

2. Configuration File Loading

Create or modify the config.json file and add the following content:

{
  "accessToken": "your-figma-token",
  "maxMemory": 512,
  "chunkSize": 100
}

Tool Usage Guide

1. Get File Data Tool (get_file_data)

Function Description

• Input: fileKey and accessToken
• Output: Returns data chunks of the specified file, supporting pagination and filtering.

Usage Example

# Request parameters:
{
  "tool": "get_file_data",
  "arguments": {
    "fileKey": "abc123",
    "nodeTypes": ["rectangle", "ellipse"]
  }
}

# Return data:
{
  "data": {
    "nodes": [ ... ],
    " pageInfo": { "hasNext": true, "cursor": "xyz456" }
  },
  "metadata": {
    "memoryUsage": 256,
    "responseTime": 500
  }
}

2. List Files Tool (list_files)

Function Description

• Input: accessToken
• Output: Returns a list of all the user's Figma files.

Usage Example

# Request parameters:
{
  "tool": "list_files",
  "arguments": {
    "accessToken": "your-figma-token"
  }
}

# Return data:
{
  "data": { "files": [...] },
  "metadata": {}
}

Memory Management Strategy

• Chunk Size: The default is 100 nodes and can be configured.
• Memory Monitoring: Track usage in real-time.
• Automatic Adjustment: Dynamically adjust according to pressure.
• Progress Tracking: Each chunk has detailed logs.

Best Practices

1. Start with small chunks (50 - 100 nodes) and optimize gradually.
2. Monitor memory usage through response metadata.
3. Use node type filtering to reduce the load as much as possible.
4. Implement pagination for large datasets.
5. Use the resume function to handle large files.

Debug Log

Example Output

[MCP Debug] Loading configuration from config.json
[MCP Debug] Found access token: xxxxxxx...
[MCP Debug] Request { tool: 'get_file_data', arguments: {...} }
[MCP Debug] Response size is 2.5 MB

Error Handling

Common Error Messages

• Memory Limit: "The response is too large. Please try using a smaller depth value or specifying a node_id."

• Invalid Parameters: "Missing required parameters: fileKey and accessToken"

• API Error: "Figma API error: [Detailed information]"

Troubleshooting

Common Issues

1. Memory Errors:

   • Reduce the chunk size.
   • Use node type filtering.
   • Implement pagination.
   • Specify a smaller depth value.

2. Performance Issues:

   • Monitor memory usage.
   • Adjust the chunk size.
   • Use appropriate node type filters.
   • Implement caching for frequently accessed data.

3. API Limits:

   • Implement rate limiting.
   • Use pagination.
   • Cache responses when possible.

Enabling Debug Mode

# Set the debug environment variable:
export DEBUG=true

Other Information

Project Repository

• URL: https://github.com/your-repository.git

Version Information

• Version: v1.0.0

License

• License Agreement: MIT License

Note: The content of this documentation is copyrighted by the author. Reproduction or copying without authorization is prohibited.