用途：当需求为“创建 MCP App”“为 MCP 工具添加 UI”“构建交互式 MCP View”或“搭建 MCP App 骨架”时使用。MCP App 在支持 MCP 的宿主（如 Claude Desktop）内运行交互式 UI。
核心概念：每个 MCP App 由两部分关联组成，工具（由 LLM/宿主调用并返回数据）与资源（提供打包的 HTML UI 展示数据）。工具的 _meta.ui.resourceUri 引用资源的 URI。流程为：宿主调用工具→宿主渲染资源 UI→服务器返回结果→UI 接收结果。
框架选择：React 提供 useApp hook，适合熟悉 React 的团队；原生 JS 手动管理生命周期，适合简单应用；Vue/Svelte/Preact/Solid 需手动管理生命周期，按框架偏好选择。
获取参考代码：
git clone --branch "v$(npm view @modelcontextprotocol/ext-apps version)" --depth 1 https://github.com/modelcontextprotocol/ext-apps.git /tmp/mcp-ext-apps
可从 /tmp/mcp-ext-apps/examples/basic-server-{framework}/ 学习并改编模板（vanillajs、react、vue、svelte、preact、solid）。每个模板包含 server.ts（registerAppTool、registerAppResource）、main.ts 入口（HTTP 与 stdio 传输）、客户端应用与生命周期处理器、global.css、使用 vite-plugin-singlefile 的 vite.config.ts、package.json 与 .gitignore。
API 参考可直接阅读 /tmp/mcp-ext-apps/src/ 中的 JSDoc，包括 app.ts（App 类与处理器）、server/index.ts、spec.types.ts、styles.ts、react/useApp.tsx。高级模式见 docs/patterns.md。
添加依赖应使用 npm install 而非手写版本号：
npm install @modelcontextprotocol/ext-apps @modelcontextprotocol/sdk zod express cors npm install -D typescript vite vite-plugin-singlefile concurrently cross-env @types/node @types/express @types/cors
TypeScript 服务器默认用 tsx 运行：
npm install -D tsx
npm pkg set scripts.dev="cross-env NODE_ENV=development concurrently 'cross-env INPUT=mcp-app.html vite build --watch' 'tsx --watch main.ts'"
注意：SDK 示例使用 bun，但生成的项目默认用 tsx 以提升兼容性。须在调用 app.connect() 之前注册所有处理器。
常见错误：未提供非 UI 宿主的文本回退；缺少 CSP 配置（MCP Apps HTML 作为 MCP 资源提供，无同源服务器，即使访问 localhost 也需 CSP）；把 CSP/CORS 配置放错 _meta 对象（_meta.ui.csp 与 _meta.ui.domain 应放在 registerAppResource() 读取回调返回的 contents[] 对象中，而非其 config 对象）；处理器注册在 app.connect() 之后；大输入未使用 ontoolinputpartial 流式展示进度。
本地测试可用 basic-host 示例。限制与具体收费、平台支持等未在资料中说明。