webcomponents-mcp-server

 

UI5 Web Components MCP Server

A Model Context Protocol server for UI5 Web Components development.

Requirements

• Node.js Version v20.17.0, v22.9.0 or higher
• npm Version v8.0.0 or higher
• An MCP client, such as VS Code (GitHub Copilot), Claude Code, Codex, or any other MCP-compatible client

Setup

Standard Configuration for Most Clients

This configuration works for most MCP clients:

{
  "mcpServers": {
    "@ui5/webcomponents-mcp-server": {
      "type": "stdio",
      "command": "npx",
      "args": ["-y", "@ui5/webcomponents-mcp-server"]
    }
  }
}

<details> <summary><i>Special configuration for native Windows</i></summary> On native Windows (not WSL), you might need to prefix npx with cmd /c:

{
  "mcpServers": {
    "@ui5/webcomponents-mcp-server": {
      "type": "stdio",
      "command": "cmd",
      "args": ["/c", "npx -y @ui5/webcomponents-mcp-server"]
    }
  }
}

</details>

Specific MCP Clients

Besides the general configuration outlined above, some MCP clients offer shortcuts for installing MCP servers.

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

Usage

Once set up, ask your AI assistant things like:

• "Show me the API for ui5-button"
• "How do I use UI5 Web Components with React?"
• "Show me the available documentation"
• "Get the theming documentation"

Available Tools

get_component_api

Fetch API docs for any UI5 Web Component (properties, slots, events, methods). Searches across @ui5/webcomponents, @ui5/webcomponents-fiori, and @ui5/webcomponents-ai packages.

get_guidelines

Get integration guides for React, Angular, or native JavaScript. Includes installation, imports, and usage examples.

list_docs

List all available UI5 Web Components documentation with summaries.

get_doc

Fetch full content of specific documentation files.

Development

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

Support, Feedback, Contributing

This project is open to feature requests/suggestions, bug reports etc. via GitHub issues. Contribution and feedback are encouraged and always welcome. For more information about how to contribute, the project structure, as well as additional contribution information, see our Contribution Guidelines.

Security / Disclosure

If you find any bug that may be a security problem, please follow our instructions at in our security policy on how to report it. Please do not create GitHub issues for security-related doubts or problems.

Code of Conduct

We as members, contributors, and leaders pledge to make participation in our community a harassment-free experience for everyone. By participating in this project, you agree to abide by its Code of Conduct at all times.

Licensing

Copyright 2025 SAP SE or an SAP affiliate company and ui5-web-components-mcp-server contributors. Please see our LICENSE for copyright and license information. Detailed information including third-party components and their licensing/copyright information is available via the REUSE tool.