{
  "markdown": "# Pixso AI Integration\n\nPixso AI Integration 是面向 Claude Code、Cursor 和 Gemini CLI 的 Pixso 本地 AI 插件。安装后，你可以让本地 agent 读取 Pixso 设计、生成代码、把网页导入 Pixso、编辑设计稿，或生成 Design-to-Code 组件解析配置。\n\nCodex 用户请使用专用仓库：[PixsoLtd/pixso-ai-integration-codex](https://github.com/PixsoLtd/pixso-ai-integration-codex)。\n\n## 前置要求\n\n1. 安装 Pixso Desktop。\n2. 打开需要操作的 Pixso 文件。\n3. 启动 Pixso MCP 服务，默认地址为：\n\n```text\nhttp://localhost:3667/mcp\n```\n\n4. 安装目标本地 agent：\n   - Claude Code\n   - Cursor\n   - Gemini CLI\n\n如果 Pixso MCP 地址不是默认值，需要同步修改本仓库中的 `.mcp.json`；Gemini CLI 用户还需要修改 `gemini-extension.json`。\n\n## 获取插件\n\n```bash\ngit clone https://github.com/PixsoLtd/pixso-ai-integration.git\ncd pixso-ai-integration\n```\n\n后续示例中的 `<repo>` 指这个仓库目录。\n\n## Claude Code\n\n启动 Claude Code 时加载本地插件目录：\n\n```bash\nclaude --plugin-dir <repo>\n```\n\nWindows PowerShell 示例：\n\n```powershell\nclaude --plugin-dir \"D:\\AI\\pixso-ai-integration\"\n```\n\n进入 Claude Code 后可以检查插件和 MCP 状态：\n\n```text\n/plugin\n/mcp\n```\n\n更新插件：\n\n```bash\ncd <repo>\ngit pull\nclaude --plugin-dir <repo>\n```\n\n更新后需要重新启动 Claude Code 会话。\n\n## Cursor\n\n安装方式：\n\n1. 打开 Cursor 设置。\n2. 进入 Plugins / 插件相关页面。\n3. 选择从本地目录安装或添加插件。\n4. 指向 `pixso-ai-integration` 仓库根目录。\n5. 重启或刷新 Cursor，使插件配置重新加载。\n\n如果你的 Cursor 版本要求单独启用第三方插件或 MCP，请在设置里开启后再重启 Cursor。\n\n更新插件：\n\n```bash\ncd <repo>\ngit pull\n```\n\n然后在 Cursor 中重新加载本地插件，或移除后重新添加同一个本地目录。\n\n## Gemini CLI\n\n从 GitHub 安装：\n\n```bash\ngemini extensions install https://github.com/PixsoLtd/pixso-ai-integration\n```\n\n从本地目录安装：\n\n```bash\ngemini extensions install <repo>\n```\n\n本地调试时可以直接 link：\n\n```bash\ngemini extensions link <repo>\n```\n\n检查安装结果：\n\n```bash\ngemini extensions list\n```\n\n更新插件：\n\n```bash\ngemini extensions update Pixso\n```\n\n如果 `gemini extensions list` 显示的名称不是 `Pixso`，以列表中的实际名称为准。link 模式下，执行 `git pull` 后重启 Gemini CLI 会话即可。\n\n## 可以怎么用\n\n安装后，可以直接用自然语言让本地 agent 调用 Pixso。\n\n### 设计转代码\n\n```text\nUse Pixso to convert this selected frame to React code and save all generated assets locally.\n```\n\n也可以提供 Pixso URL：\n\n```text\nConvert this Pixso URL to Vue code: <Pixso node URL>\n```\n\n### 网页或 HTML 导入 Pixso\n\n```text\nImport this page into Pixso as editable design nodes: https://example.com\n```\n\n如果页面需要登录、权限、区域访问或资源不可抓取，agent 会先说明阻塞点，不会自动降级成近似重建设计。\n\n### Pixso 设计编辑\n\n```text\nCreate a dashboard screen in the current Pixso file using the existing design tokens and components.\n```\n\n```text\nRefine the selected Pixso frame: improve spacing, hierarchy, and visual consistency.\n```\n\n### 组件解析配置\n\n使用命令：\n\n```text\n/pixso-d2c-plus-config\n```\n\n或直接描述需求：\n\n```text\nGenerate componentParsers for the current Pixso component library and Element Plus.\n```\n\n## 常见问题\n\n### 插件加载了，但 Pixso 工具不可用\n\n检查 Pixso MCP 是否启动：\n\n```powershell\nInvoke-WebRequest -UseBasicParsing -Method Head -Uri \"http://localhost:3667/mcp\"\n```\n\n如果请求失败，先启动 Pixso Desktop，并确认 MCP 服务已开启。\n\n### 修改 MCP 端口后没有生效\n\n确认修改了当前 agent 使用的配置文件，并重启或重新加载插件：\n\n| Agent | 配置文件 |\n| --- | --- |\n| Claude Code | `.mcp.json` |\n| Cursor | `.mcp.json` |\n| Gemini CLI | `gemini-extension.json` |\n\n### 看不到 `/pixso-d2c-plus-config`\n\n通常是插件缓存或旧会话导致。更新插件后，重启当前 agent；Gemini CLI install 模式还需要运行 `gemini extensions update Pixso`。\n\n## 参考\n\n- [Claude Code plugins](https://code.claude.com/docs/en/plugins)\n- [Cursor plugins specification](https://github.com/cursor/plugins)\n- [Gemini CLI extensions](https://google-gemini.github.io/gemini-cli/docs/extensions/)\n",
  "bytes": 3256,
  "sha": "fadba374124da90ef62d8482b5d44b952a30e367e96da778dee20d3b7970b840",
  "repo_slug": "pixsoltd/pixso-ai-integration",
  "fonte": "repo",
  "truncated": false,
  "api": "https://agentalog.com/api/listings/plg_pixsoltd_pixso_ai_integration_cc0a8599/readme"
}