Framer プラグイン MCP サーバー

Web3機能を備えたFramerプラグインの作成と管理を可能にするModel Context Protocol（MCP）サーバー。このサーバーは、ウォレット接続、コントラクトのやり取り、NFTの表示といったWeb3機能を統合したFramerプラグインの作成、構築、管理のためのツールを提供します。

特徴

• Web3機能を備えた新しいFramerプラグインを作成する

• 本番環境用のプラグインを構築する

• 統合されたWeb3機能:

  • Wallet Connectの統合

  • スマートコントラクトの相互作用

  • NFTディスプレイコンポーネント

Related MCP server: Frame0 MCP Server

要件

• Node.js 16以上

• NPM または Yarn

• プラグインをテストするためのFramerデスクトップアプリ

インストール

1. このリポジトリをクローンします:

git clone https://github.com/sheshiyer/framer-plugin-mcp.git
cd framer-plugin-mcp

2. 依存関係をインストールします:

npm install

3. サーバーを構築します。

npm run build

構成

サーバーを MCP 設定ファイルに追加します。

Claude デスクトップ アプリの場合 ( ~/Library/Application Support/Claude/claude_desktop_config.json ):

{
  "mcpServers": {
    "framer-plugin": {
      "command": "node",
      "args": ["/path/to/framer-plugin-mcp/build/index.js"]
    }
  }
}

Cursor/Claude Dev の場合 ( ~/Library/Application Support/Cursor/User/globalStorage/saoudrizwan.claude-dev/settings/cline_mcp_settings.json ):

{
  "mcpServers": {
    "framer-plugin": {
      "command": "node",
      "args": ["/path/to/framer-plugin-mcp/build/index.js"]
    }
  }
}

使用法

構成が完了すると、サーバーは次のツールを提供します。

プラグインの作成

Web3 機能を備えた新しい Framer プラグイン プロジェクトを作成します。

パラメータ:

• name: プラグイン名

• 説明: プラグインの説明

• outputPath: 出力ディレクトリのパス

• web3Features: 含める機能の配列 (wallet-connect、contract-interaction、nft-display)

例：

{
  "name": "my-web3-plugin",
  "description": "A Framer plugin with web3 features",
  "outputPath": "./plugins/my-web3-plugin",
  "web3Features": ["wallet-connect", "nft-display"]
}

ビルドプラグイン

本番環境用の Framer プラグイン プロジェクトをビルドします。

パラメータ:

• pluginPath: プラグインディレクトリへのパス

例：

{
  "pluginPath": "./plugins/my-web3-plugin"
}

貢献

貢献を歓迎します！お気軽にプルリクエストを送信してください。

ライセンス

MITライセンス - 詳細はLICENSEファイルを参照