mcpField
W
webcomponents-mcp-server

webcomponents-mcp-server

本地服务
github.com/UI5开发工具2032 周前更新
代码仓库

关于 webcomponents-mcp-server

webcomponents-mcp-server 是为 UI5 Web Components 开发提供文档的 MCP 服务。开发者可通过兼容 MCP 的客户端查询组件 API、框架集成指南和文档。

主要功能

  1. 01组件 API 文档查询
  2. 02React、Angular 和 JavaScript 指南
  3. 03文档列表与内容获取
  4. 04覆盖三个 UI5 软件包

适用场景

  1. 01查询组件的属性和事件
  2. 02查找 UI5 Web Components 集成示例
  3. 03浏览或获取相关文档

MCP 相关

该服务通过 stdio 运行，并提供 MCP 工具，用于查询组件 API、集成指南、文档列表和文档内容。

配置

本地服务的配置在各客户端中通用，复制后粘贴到客户端的 MCP 配置文件即可。

mcp.json · 通用配置
{
  "mcpServers": {
    "ui5-webcomponents": {
      "command": "npx",
      "args": [
        "-y",
        "@ui5/webcomponents-mcp-server"
      ]
    }
  }
}
启动命令npx -y @ui5/webcomponents-mcp-server

本地服务需要在你的电脑上安装运行环境（如 Node.js 18+）。各客户端的配置文件位置不同，请参考客户端文档。

安装包
npm@ui5/webcomponents-mcp-server0.1.2

工具

4

收录的工具列表 · 更新于 2 周前

参数类型必填说明
versionstring否UI5 Web Components 包的版本（例如 "2.12.0"）。如果未提供，则使用最新版本。
componentNamestring是组件名称（例如，'ui5-button'、'ui5-input'、'ui5-shellbar'）

详细介绍

REUSE 状态 npm 包版本

UI5 Web Components MCP Server

用于 UI5 Web Components 开发的 Model Context Protocol 服务。

要求

  • Node.js，版本 v20.17.0、v22.9.0 或更高
  • npm，版本 v8.0.0 或更高
  • MCP 客户端，例如 VS Code（GitHub Copilot）、Claude Code、Codex，或其他兼容 MCP 的客户端

设置

大多数客户端的标准配置

此配置适用于大多数 MCP 客户端：

{
  "mcpServers": {
    "@ui5/webcomponents-mcp-server": {
      "type": "stdio",
      "command": "npx",
      "args": ["-y", "@ui5/webcomponents-mcp-server"]
    }
  }
}
原生 Windows 的特殊配置 在原生 Windows（非 WSL）上，你可能需要在 npx 前加上 `cmd /c`： 
{
  "mcpServers": {
    "@ui5/webcomponents-mcp-server": {
      "type": "stdio",
      "command": "cmd",
      "args": ["/c", "npx -y @ui5/webcomponents-mcp-server"]
    }
  }
}
特定 MCP 客户端

除了上述通用配置外，一些 MCP 客户端还提供了安装 MCP 服务的快捷方式。

VS Code
code --add-mcp '{"name":"@ui5/webcomponents-mcp-server","type":"stdio","command":"npx","args":["-y","@ui5/webcomponents-mcp-server"]}'
Claude Code
claude mcp add --transport stdio --scope user ui5-webc-mcp-server -- npx -y @ui5/webcomponents-mcp-server
Codex
codex mcp add --transport stdio ui5-webc-mcp-server -- npx -y @ui5/webcomponents-mcp-server

使用方法

设置完成后，可以向 AI 助手提出以下问题：

  • “显示 ui5-button 的 API”
  • “如何在 React 中使用 UI5 Web Components？”
  • “显示可用的文档”
  • “获取主题文档”

可用工具

get_component_api

获取任意 UI5 Web Component 的 API 文档（属性、插槽、事件、方法）。
搜索 @ui5/webcomponents、@ui5/webcomponents-fiori 和 @ui5/webcomponents-ai 包。

get_guidelines

获取 React、Angular 或原生 JavaScript 的集成指南。
包含安装、导入和用法示例。

list_docs

列出所有可用的 UI5 Web Components 文档及其摘要。

get_doc

获取指定文档文件的完整内容。

开发

npm run build         # Build TypeScript
npm run dev           # Run locally
npm run test          # Run tests
npm run inspector     # Debug with MCP inspector
npm run prepare:docs  # Fetch latest docs from GitHub

支持、反馈与贡献

本项目欢迎通过 GitHub issues 提交功能请求、建议、错误报告等。欢迎并鼓励大家参与贡献并提供反馈。有关如何贡献、项目结构以及其他贡献信息，请参阅我们的贡献指南。

安全 / 漏洞披露

如果你发现可能涉及安全问题的错误，请按照我们的安全政策中的说明进行报告。请勿就安全相关的疑问或问题创建 GitHub issues。

行为准则

作为社区成员、贡献者和领导者，我们承诺让每个人都能在免受骚扰的环境中参与社区活动。参与本项目即表示你同意始终遵守我们的行为准则。

许可

版权所有 2025 SAP SE 或 SAP 关联公司，以及 ui5-web-components-mcp-server 贡献者。有关版权和许可信息，请参阅我们的 LICENSE。包括第三方组件及其许可 / 版权信息在内的详细信息，可通过 REUSE 工具获取。

评论

支持 Markdown

第一次接触 MCP？

从协议是什么，到在客户端里装上第一个服务，这几条回答覆盖了大多数入门问题。

一个开放协议，规定了 AI 应用如何以统一方式连接外部工具与数据源。客户端负责与模型对话，MCP 服务负责提供工具、资源和提示模板，两者通过标准消息通信，同一个服务可以被不同客户端复用。