使用 mcp-ui 渲染交互式 MCP 工具 UI
Build an MCP Apps resource, attach it to a tool through _meta.ui.resourceUri, and verify the host renders the interactive UI alongside tool results.
Prerequisites
MCP server, MCP Apps-compatible host or legacy MCP-UI host, TypeScript packages @mcp-ui/server and @mcp-ui/client; Python and Ruby server SDKs are also available.
Installation
Use the upstream install or setup path that matches your environment:
- npm install @mcp-ui/server @mcp-ui/client
- pnpm add @mcp-ui/server @mcp-ui/client
- yarn add @mcp-ui/server @mcp-ui/client
- gem install mcp_ui_server
Requirements and caveats from upstream:
- <a href="https://pypi.org/project/mcp-ui-server/"><img src="https://img.shields.io/pypi/v/mcp-ui-server?label=python&color=yellow" alt="Python Server SDK Version"></a>
- mcp-ui-server (Python): Create UI resources in Python.
- UI snippets must be able to interact with the agent. In mcp-ui, this is done by hooking into events sent from the UI snippet and reacting to them in the host (see onUIAction prop). For example, an HTML may trigger a t...
Basic usage or getting-started notes:
- <a href="#-getting-started">Getting Started</a> •
- Usage:
- Source: https://github.com/1991513ccie-png/skills
- Extracted from upstream docs: https://raw.githubusercontent.com/MCP-UI-Org/mcp-ui/HEAD/README.md
Documentation
- https://github.com/1991513ccie-png/skills