Fontawesome MCP

🎯 Font Awesome Pro MCP服务器

一个模型上下文协议（MCP）服务器，为Font Awesome Pro图标提供模糊搜索和检索功能。使用Node.js、TypeScript和Express构建。

✨ 特性

• 🔍 模糊搜索：使用Fuse.js的智能搜索查找图标
• 📦 图标检索：获取包括SVG内容在内的完整图标数据
• 🔌 MCP兼容：MCP客户端的标准JSON-RPC接口
• 🌐 多种访问方法：HTTP API、MCP协议和直接SVG端点
• 💎 Font Awesome Pro支持：访问所有Pro图标样式（纯色、常规、浅色、薄型、双色调）

📋 先决条件

• Node.js 18+
• Font Awesome Pro许可证，配置了NPM访问令牌 ~/.npmrc:

  @fortawesome:registry=https://npm.fontawesome.com/
  //npm.fontawesome.com/:_authToken=YOUR_TOKEN_HERE

🚀 安装

选项1:NPM包（即将推出）

发布到NPM后，您可以直接安装：

# Install and run via npx (no local setup required)
npx @chrisreedio/fontawesome-pro-mcp

# Or install globally
npm install -g @chrisreedio/fontawesome-pro-mcp
fontawesome-pro-mcp

选项2：开发/本地设置

# Clone the repository
git clone https://github.com/chrisreedio/fontawesome-mcp.git
cd fontawesome-mcp

# Install dependencies (uses your FA Pro token automatically)
npm install

# Build the project
npm run build

🧭 Using

在您最喜欢的客户端中设置此MCP服务器。

克劳德桌面

推荐（npx）：

{
  "mcpServers": {
    "fontawesome-pro": {
      "command": "npx",
      "args": ["-y", "@chrisreedio/fontawesome-pro-mcp"]
    }
  }
}

地方发展路径：

{
  "mcpServers": {
    "fontawesome-pro": {
      "command": "node",
      "args": ["/ABSOLUTE/PATH/TO/fontawesome-mcp/dist/mcp-server.js"]
    }
  }
}

配置文件位置：

• macOS： ~/Library/Application Support/Claude/claude_desktop_config.json
• 窗户： %APPDATA%/Claude/claude_desktop_config.json

编辑配置后重新启动Claude Desktop。

光标

选项1：易于安装-一键


或者点击这个深度链接： 一键安装

选项2：手动设置

步骤：

• 打开光标设置（Cmd+Shift+J）→ MCP服务器
• 添加服务器并粘贴以下配置之一
• 如果工具未出现，请重新启动光标

推荐（npx）：

{
  "mcpServers": {
    "fontawesome-pro": {
      "command": "npx",
      "args": ["-y", "@chrisreedio/fontawesome-pro-mcp"]
    }
  }
}

地方发展路径：

{
  "mcpServers": {
    "fontawesome-pro": {
      "command": "node",
      "args": ["/ABSOLUTE/PATH/TO/fontawesome-mcp/dist/mcp-server.js"]
    }
  }
}

提示：

• 如果您使用许多MCP服务器，请确保在Cursor的MCP UI中未禁用此服务器
• 一些Cursor构建优先考虑数量有限的工具；提前放置此服务器会有所帮助

VS代码

您可以使用Claude Code CLI或Claude Dev扩展。

CLI（推荐）：

claude mcp add fontawesome-pro -- npx -y @chrisreedio/fontawesome-pro-mcp

本地路径备选方案：

claude mcp add fontawesome-pro node /ABSOLUTE/PATH/TO/fontawesome-mcp/dist/mcp-server.js

Claude Dev（Cline）配置示例：

{
  "mcpServers": {
    "fontawesome-pro": {
      "command": "npx",
      "args": ["-y", "@chrisreedio/fontawesome-pro-mcp"]
    }
  }
}

常见位置：

• macOS： ~/Library/Application Support/Code/User/globalStorage/saoudrizwan.claude-dev/settings/cline_mcp_settings.json
• 窗户： %APPDATA%/Code/User/globalStorage/saoudrizwan.claude-dev/settings/cline_mcp_settings.json

🎮 用法

发展

npm run dev

生产

npm start

服务器运行在 http://localhost:8000 默认情况下。集 PORT 环境变量发生变化。

🔗 API终点

❤️ 健康检查

GET /health

返回服务器状态和时间戳。

🌐 简单HTTP API

🔍 搜索图标

POST /api/search
Content-Type: application/json

{
  "query": "home",
  "limit": 5,
  "style": "solid"  // optional: solid|regular|light|thin|duotone|brands
}

📦 获取特定图标

POST /api/icon
Content-Type: application/json

{
  "name": "house-signal",
  "style": "solid"
}

🔌 MCP JSON-RPC协议

📋 列出可用工具

POST /rpc
Content-Type: application/json

{
  "jsonrpc": "2.0",
  "id": 1,
  "method": "tools/list"
}

⚡ 调用工具

POST /rpc
Content-Type: application/json

{
  "jsonrpc": "2.0",
  "id": 2,
  "method": "tools/call",
  "params": {
    "name": "fuzzySearch",
    "arguments": {
      "query": "search",
      "limit": 3
    }
  }
}

🎨 直接SVG访问

GET /svg/:style/:name.svg

例子： http://localhost:8000/svg/solid/house-signal.svg

🛠️ 可用工具

模糊搜索

使用模糊匹配搜索Font Awesome Pro图标。

参数：

• query （string）：图标搜索查询
• limit （数字，可选）：返回的最大结果数（默认值：20）
• style （字符串，可选）：按图标样式过滤

退货： 带有元数据的匹配图标数组。

getIcon

获取一个包含完整数据（包括SVG内容）的特定Font Awesome Pro图标。

参数：

• name （string）：图标名称（例如“home”、“user”）
• style （字符串）：图标风格（实心|规则|轻|薄|双色|品牌）

退货： 带有SVG内容的图标对象。

📄 响应格式

图标返回的结构如下：

{
  "name": "house-signal",
  "style": "solid", 
  "label": "House Signal",
  "search": {
    "terms": ["abode", "building", "connect", "family", "home", "residence", "smart home", "wifi", "www"]
  },
  "unicode": "e012",
  "svg": "..."
}

🏗️ 建筑

src/
├── server.ts          # Express server + MCP setup
├── fa/               # Font Awesome helpers
│   ├── types.ts      # TypeScript interfaces
│   └── loader.ts     # Metadata loading + SVG retrieval
└── methods/          # MCP method implementations
    ├── fuzzySearch.ts # Icon search functionality  
    └── getIcon.ts     # Icon retrieval functionality

🚢 生产部署

对于生产使用，您需要将服务器作为持久服务运行，该服务在故障时自动重启，并在系统重启后继续运行。以下是最常见的部署方法：

⚡ PM2过程经理（推荐）

PM2是一个流行的Node.js进程管理器，可以处理自动重启、日志记录和集群。

# Install PM2 globally
npm install -g pm2

# Start the server
pm2 start npm --name "fontawesome-mcp" -- start

# Save current PM2 processes
pm2 save

# Setup auto-restart on system reboot
pm2 startup

# Monitor the process
pm2 status
pm2 logs fontawesome-mcp

🐳 码头工人

容器化部署，实现一致的环境和轻松扩展。

首先，创建一个 Dockerfile:

FROM node:18-alpine

WORKDIR /app

# Copy package files
COPY package*.json ./

# Install dependencies
RUN npm ci --only=production

# Copy source and build
COPY . .
RUN npm run build

# Expose port
EXPOSE 8000

# Start server
CMD ["npm", "start"]

然后构建并运行：

# Build image
docker build -t fontawesome-mcp .

# Run container
docker run -d -p 8000:8000 --restart unless-stopped --name fontawesome-mcp fontawesome-mcp

# View logs
docker logs fontawesome-mcp

🐧 系统服务（Linux）

对于Linux服务器，systemd提供了强大的服务管理。

创建 /etc/systemd/system/fontawesome-mcp.service:

[Unit]
Description=Font Awesome MCP Server
After=network.target

[Service]
Type=simple
User=your-username
WorkingDirectory=/path/to/fontawesome-mcp
ExecStart=/usr/bin/node dist/server.js
Restart=always
RestartSec=10
Environment=NODE_ENV=production
Environment=PORT=8000

[Install]
WantedBy=multi-user.target

启用并启动服务：

sudo systemctl daemon-reload
sudo systemctl enable fontawesome-mcp
sudo systemctl start fontawesome-mcp

# Check status
sudo systemctl status fontawesome-mcp

🔧 环境变量

为生产设置这些环境变量：

NODE_ENV=production
PORT=8000
LOG_LEVEL=info

🛠️ 发展

脚本

• npm run dev -具有热重载功能的开发服务器
• npm run dev:mcp -在开发模式下启动本地MCP服务器
• npm run build -将TypeScript构建为JavaScript
• npm run start -运行生产服务器
• npm run start:mcp -从构建文件运行本地MCP服务器
• npm run clean -删除构建工件

测试

运行综合测试套件以验证功能：

# Run all tests
npm test

# Run tests in watch mode (for development)
npm run test:watch

# Run tests with coverage report
npm run test:coverage

测试套件包括：

• 单元测试：核心搜索和图标检索方法
• 集成测试：通过stdio实现本地MCP服务器功能
• HTTP API测试：所有REST端点和MCP JSON-RPC接口
• 错误处理：验证和边缘案例场景

测试验证HTTP服务器和本地MCP服务器实现是否正常工作。

出版

要将此包发布到NPM，请执行以下操作：

# Ensure you're logged into NPM
npm login

# Publish the scoped package as public (required for @username/package-name format)
npm publish --access public

注： 此包使用作用域名称(@chrisreedio/fontawesome-pro-mcp)，所以 --access public 需要标志才能让公众访问。如果没有此标志，NPM将尝试将其作为私有包发布。

该套餐包括 prepublishOnly 在发布之前自动构建项目的脚本。

关键依赖关系

• 快速：HTTP服务器框架
• Fuse.js：模糊搜索实现
• js yaml：FA元数据的YAML解析
• 动物圈：架构验证
• @模型上下文协议/sdk：MCP协议支持

📄 许可证

麻省理工学院

💎 Font Awesome Pro

这个项目需要Font Awesome Pro。Font Awesome Pro是一款商业产品，请确保您的用例有适当的许可。