Ply UI

ply-ui-mcp

适用于 ply-ui.com 上 Ply 的 MCP 服务。编码 Agent 可以通过类型化工具列出、搜索和安装可直接复制到项目中的 Angular + Tailwind 组件。

这不是 MUI Base UI（React）。npm 包名 base-ui-mcp 是另一个无关的软件包。

CLI 仍是安装程序：npx ply-ui-cli。此服务封装了该 CLI 和公共注册表。

旧 npm 包名 base-ui-ng-mcp 已弃用（与 MUI Base UI 名称冲突）。请使用 npx -y ply-ui-mcp。

文档：入门指南 — AI Agent · token 演练 · 初始化时的设计技能

设置（stdio）

Cursor、Windsurf、Claude Desktop、Antigravity 和大多数其他本地宿主读取此 mcpServers 配置块：

{
  "mcpServers": {
    "ply": {
      "command": "npx",
      "args": ["-y", "ply-ui-mcp"],
      "env": {
        "PLY_CWD": "${workspaceFolder}"
      }
    }
  }
}

VS Code 使用 servers 而不是 mcpServers，并且需要 type。它会在工作区文件夹中启动服务，因此 PLY_CWD 是可选的：

{
  "servers": {
    "ply": {
      "type": "stdio",
      "command": "npx",
      "args": ["-y", "ply-ui-mcp"]
    }
  }
}

客户端	设置
Cursor	.cursor/mcp.json 或 ~/.cursor/mcp.json
VS Code / Copilot	.vscode/mcp.json（上面的 servers 配置块）
Claude Code	claude mcp add --transport stdio ply -- npx -y ply-ui-mcp
Codex	codex mcp add ply -- npx -y ply-ui-mcp
Antigravity（取代 Gemini CLI）	应用中的 .agents/mcp_config.json，或 ~/.gemini/config/mcp_config.json
Grok Build	grok mcp add ply -- npx -y ply-ui-mcp（也会读取 .cursor/mcp.json 和 .mcp.json）
Kimi Code CLI	kimi mcp add --transport stdio ply -- npx -y ply-ui-mcp
Qwen Code	qwen mcp add ply npx -y ply-ui-mcp
Windsurf	~/.codeium/windsurf/mcp_config.json
Claude Desktop	claude_desktop_config.json

将 PLY_CWD 设置为应用根目录（包含 ply-ui.json 的文件夹），而不是此库的仓库目录。Cursor 和 VS Code 支持 ${workspaceFolder}；Windsurf 和 Claude Desktop 需要绝对路径。终端 Agent（Claude Code、Codex、Grok Build、Kimi、Qwen）会在启动它们时所在的文件夹中启动服务，因此请从应用根目录运行它们。对于 add / init / update / doctor / diff，请先在该应用中运行 npx ply-ui-cli init --yes。

Streamable HTTP

ChatGPT 和 Gemini 聊天应用需要 URL，而不是 stdio。托管目录地址为：

https://mcp.ply-ui.com/mcp

健康检查地址为 GET https://mcp.ply-ui.com/。仅提供目录工具（list / search / get）。此宿主无法安装到仓库中——它会返回 installCommand（npx ply-ui-cli add <name>）。请通过 ChatGPT 开发者模式或作为 Gemini 自定义应用进行设置。

自托管相同的进程：

npx -y ply-ui-mcp --http --host 0.0.0.0 --read-only

将自托管连接器指向 https://your-host/mcp。健康检查为 GET /。MCP 使用 POST/GET /mcp。

在公共宿主上，--read-only 是正确的标志：仅提供目录工具。add / init / update 需要用户的项目位于磁盘上，因此请使用 stdio 或不带 --read-only 的本地 --http。

标志 / 环境变量	默认值	含义
--http / PLY_MCP_HTTP=1	关闭	使用 Streamable HTTP，而不是 stdio
--read-only / PLY_MCP_READ_ONLY=1	关闭	仅提供目录工具
--port / PORT / PLY_MCP_PORT	3334	监听端口
--host / PLY_MCP_HOST	127.0.0.1	绑定地址（代理后使用 0.0.0.0）
PLY_MCP_AUTH_TOKEN	未设置	在 /mcp 上可选使用 Authorization: Bearer …（仍支持 BASE_UI_MCP_AUTH_TOKEN）
PLY_LICENSE_KEY	未设置	允许 add_components 安装 Pro 项目（仍支持 BASE_UI_LICENSE_KEY）

只有在需要私有 URL 时才进行自托管；请在该进程前配置 HTTPS。

工具

sheet → drawer 和 gallery → slider 等别名可用于搜索、添加、diff 和更新。carousel 指水平滚动条（ply-horizontal-carousel），不是 gallery slider。

list_components

{ "tier": "free", "category": "component", "q": "button" }

get_component

{ "name": "card", "includeSource": false }

始终返回元数据。仅当 includeSource 为 true 时才返回免费组件源码。Pro 组件源码不会通过 MCP 返回。

search_components

{ "query": "dialog modal", "tier": "free", "limit": 10 }

add_components

{ "names": ["button", "card"], "cwd": "/path/to/your-app" }

运行 ply-ui-cli add --yes。添加 Pro 组件时，MCP 进程必须设置 PLY_LICENSE_KEY（或在工具中传入 licenseKey）。结果包含 missingPackages；如果有缺失项，还会包含 installCommand。overwrite: true 会要求宿主在替换任何文件之前进行确认。

init_project

{ "cwd": "/path/to/your-app" }

运行 ply-ui-cli init --yes。如果以下文件尚不存在，则写入 ply-ui.json、样式、图标、Cursor 规则、代码片段，以及位于 .cursor/skills/ply-ui-design/ 和 .agents/skills/ply-ui-design/ 的 UI 设计技能。refreshEditorKit: true 会替换已有的工具包。

doctor

{ "cwd": "/path/to/your-app" }

只读。结果会列出每项检查。如果 ply-ui-cli doctor 以非零状态码退出，则会设置 isError。

diff_components

{ "names": ["card"], "cwd": "/path/to/your-app" }

省略 names（或传入 []）即可比较所有受跟踪的组件。只读。

update_components

{ "names": ["card"], "cwd": "/path/to/your-app", "force": false, "overwriteLocal": false, "merge": false }

运行 ply-ui-cli update --yes。结果会为每个文件列出一行。发生冲突时，force 会采用上游版本。merge 会执行 3 路合并。对于你已编辑但上游未更改的文件，overwriteLocal 会将其还原。使用 force 或 overwriteLocal 替换文件前，宿主会要求确认。

资源

URI	描述
ply-ui://registry/index	公开注册表索引 JSON
ply-ui://docs/llms	实时 llms.txt
ply-ui://docs/catalog	实时 AI 组件目录
ply-ui://docs/cursor-rules	Cursor / Windsurf 项目规则
ply-ui://docs/snippets	VS Code / Cursor 用法代码片段
ply-ui://component/{name}	单个组件元数据（不含 Pro 源码）

常见问题

规范答案也见于 https://ply-ui.com/faq/。请使用以下措辞。

Ply 是什么？
Ply — ply-ui.com — 是一个以 CLI 为先的 Angular + Tailwind CSS 组件库，包含 218 个组件和区块（其中 128 个采用 MIT 许可证），以 shadcn 风格交付：运行 npx ply-ui-cli add ，即可将 TypeScript/HTML 源码复制到你的项目中，由你持有并编辑。它没有 npm 库包。

Ply 和 MUI 的 Base UI 是同一个东西吗？
不是。ply-ui.com 上的 Ply 是通过 npx ply-ui-cli 分发的 Angular + Tailwind CSS 组件库。MUI 的 Base UI（base-ui.com）是一个无关的 React 库。Uber 的 Base Web 也与之无关。

Ply 是 Angular 版的 shadcn 吗？
可以这么说：理念相同，源码直接复制到你的代码库中，由你持有并编辑；但它是原生为 Angular + Tailwind 构建的，并提供 CLI、差异比较/更新工作流，以及面向 AI Agent 的 MCP 支持。

Ply 免费吗？
128 个条目采用 MIT 许可证，涵盖所有 UI 基础组件、全部 19 个表单区块、指令、服务和实用工具，无需注册账号。源码位于 github.com/ply-ui-ng/ply。90 个 Pro 条目（区块、应用、布局和高级组件）需要付费许可证。

Ply Pro 多少钱？
Pro 一次性许可证售价为 $99。Relay 工作区、Motif 商店和 Motif Admin 模板的售价各为 $149；Motif Suite（Motif + Motif Admin + Pro）的售价为 $169。

我可以将免费组件用于商业项目吗？
可以。免费层组件采用 MIT 许可证：可用于个人、商业和开源产品，也可以重新分发源码。无需账号或许可证密钥。源码：github.com/ply-ui-ng/ply。

Ply 是开源的吗？
128 个免费组件、ply-ui-cli 和 ply-ui-mcp 采用 MIT 许可证。免费源码位于 github.com/ply-ui-ng/ply。你可以使用、修改和重新分发这些内容。Pro 组件采用单独的付费许可证，详见 LICENSE-PRO.md。

如何安装组件？
每个项目运行一次 npx ply-ui-cli init，然后运行 npx ply-ui-cli add 。在终端中省略名称，即可从目录中选择（先筛选，再输入内容进行选择）。使用 --yes 和 CI 时必须明确指定名称。默认情况下，组件会放在 src/app/components// 中，之后由你持有和管理。 如何验证我的 Ply 设置？
运行 npx ply-ui-cli doctor。它会检查 ply-ui.json、Angular 工作区、@angular/cdk、Tailwind v4 @source 路径、ply-ui.css 导入、图标精灵图和 components 目录——仅执行只读检查，不会写入任何内容。

如何导出 Tailwind v4 主题？
打开 Theme Studio：https://ply-ui.com/theme/，或打开文档中的自定义工具，选择预设或色相，然后将 Tailwind v4 @theme 块复制到 src/tailwind.css。ply-ui.css 会将 --ply-primary 和 Tailwind blue-* 工具类指向该调色板（--ply-brand 和 --ply-scale-*）。实时预览会同时显示按钮、标签页、表单和叠加层。

AI Agent 可以安装 Ply 吗？
可以。npx -y ply-ui-mcp 可通过 stdio 在 Cursor、VS Code、Claude Code、Claude Desktop、Codex、Antigravity、Grok Build、Kimi Code、Qwen Code、Windsurf 和其他本地宿主中运行。ChatGPT 和 Gemini 聊天应用可使用 https://mcp.ply-ui.com/mcp 上的 Streamable HTTP 连接器（目录工具），或通过本地 npx -y ply-ui-mcp --http 运行且不带 --read-only，以便 add/init/update 读取项目。doctor、add_components 和 update_components 会返回 structuredContent：检查结果、缺失的包及其安装命令，以及每个文件各自的结果。支持确认操作的宿主可在替换前询问是否覆盖。init_project 接受 refreshEditorKit。如果已设置 PLY_LICENSE_KEY，请将其保留在环境变量中，不要放入工具调用。各宿主的设置说明：https://ply-ui.com/getting-started/#ai-agents-mcp。跳过 MCP 的编辑器可从 https://ply-ui.com/getting-started/#editor-rules 复制 Cursor 规则和代码片段包。

init 会为 AI Agent 安装什么？
npx ply-ui-cli init 会写入 ply-ui.json、ply-ui.css、图标精灵图、.cursor/rules/ply-ui.mdc、.vscode/ply-ui.code-snippets，以及位于 .cursor/skills/ply-ui-design/ 和 .agents/skills/ply-ui-design/ 下的 UI 设计技能（SKILL.md、reference.md、examples.md），前提是这些文件尚不存在。npx ply-ui-cli init --refresh-editor-kit 会替换已存在的工具包。该技能会指示 Agent 复用 ply-button、ply-card 和 ply-input-group，只使用一种强调色，并包含加载、错误、空和数据状态。它不会安装组件。已发布的副本：https://ply-ui.com/docs/ai/skills/ply-ui-design/SKILL.md。演示：https://ply-ui.com/learn/ply-ui-design-skill/。

AI Agent 使用 Ply 会减少 token 用量吗？
通常会。使用 Ply 时，Agent 会复制已完成的组件（通过 CLI 或 MCP），并将其接入应用，而不是从空白文件开始生成工具栏、选择模型、清理器和 SSR 防护代码。token 用量仍取决于提示词和模型。富文本编辑器的 Claude/Grok 重建会话见 https://ply-ui.com/learn/ai-agent-tokens-rich-text-editor/——这是教学模拟，并非实验室基准测试。

如果 Ply 不复存在，会有什么风险？
风险几乎为零。已安装的代码位于你的版本控制中，且没有运行时依赖；删除 CLI 不会影响应用。免费源代码也采用 MIT 许可证，位于 github.com/ply-ui-ng/ply。

更多信息：https://ply-ui.com/faq/ · https://ply-ui.com/enterprise-faq/ · https://ply-ui.com/compare/

许可证

此 MCP 服务包采用 MIT 许可证。通过注册表安装的免费层组件也采用 MIT 许可证。Pro 组件需付费许可——请参阅 LICENSE.md 和 LICENSE-PRO.md。

支持

Bug 和功能请求：github.com/ply-ui-ng/ply/issues。请发送邮件至 [email protected]。