Hugeicons MCP Server

🚀 Hugeicons MCP サーバー

Hugeicons の統合とドキュメント用の MCP サーバーです。

このサーバーは TypeScript ベースの MCP サーバーで、様々なプラットフォームで Hugeicons を統合するためのツールとリソースを提供します。モデルコンテキストプロトコル（MCP）サーバーを実装し、AI アシスタントが Hugeicons の使用に関する正確なガイダンスを提供できるように支援します。

✨ 主な機能

ツール

• list_icons - 利用可能なすべての Hugeicons アイコンのリストを取得します。
• search_icons - 名前またはタグでアイコンを検索します。
• get_platform_usage - 特定のプラットフォームでの Hugeicons の使用方法を取得します。

リソース

プラットフォームドキュメント（Markdown 形式で提供）：

• hugeicons://docs/platforms/react - React 統合ガイド
• hugeicons://docs/platforms/vue - Vue 統合ガイド
• hugeicons://docs/platforms/angular - Angular 統合ガイド
• hugeicons://docs/platforms/svelte - Svelte 統合ガイド
• hugeicons://docs/platforms/react-native - React Native 統合ガイド
• hugeicons://docs/platforms/flutter - Flutter 統合ガイド

アイコンデータ：

• hugeicons://icons/index - すべての Hugeicons の完全なインデックス（JSON 形式）

機能

このサーバーは、以下を含む包括的な Hugeicons 統合サポートを提供します。

• アイコンの発見と検索
• プラットフォーム固有のインストールガイド
• 使用例のコードスニペット
• コンポーネント属性のドキュメント
• パッケージのインストール手順

🔧 開発

依存関係のインストール

npm install

サーバーのビルド

npm run build

自動再構築付きの開発

npm run watch

📦 インストール

Claude Desktop と一緒に使用するには、サーバーの設定を追加してください。

MacOS では：~/Library/Application Support/Claude/claude_desktop_config.json Windows では：%APPDATA%/Claude/claude_desktop_config.json

{
  "mcpServers": {
    "hugeicons": {
      "command": "npx",
      "args": [
        "-y",
        "@hugeicons/mcp-server"
      ]
    }
  }
}

args 配列は以下を指定します。

1. -y：npx のプロンプトに自動的に「はい」と回答します。
2. パッケージ名：@hugeicons/mcp-server

クイックスタート

npx を直接使用してサーバーを実行することもできます。

npx @hugeicons/mcp-server

デバッグ

MCP サーバーは stdio を通じて通信するため、デバッグは難しい場合があります。MCP Inspector の使用をおすすめします。これはパッケージスクリプトとして利用可能です。

npm run inspector

Inspector は、ブラウザでデバッグツールにアクセスするための URL を提供します。