@mastergo/dsh-canvas

中文

@mastergo/dsh-canvas 将 DeepSeek Harness 连接到同一台电脑上打开的 MasterGo Web 画布。npm 包内包含并管理 DSH 专用的 mgmcp-dsh，普通用户 不需要安装 MasterGo 客户端、单独下载 MCP 二进制或配置本地端口。

当前版本能力

• 读取当前选中的画布节点、截图和前端代码。
• 查询组件库、组件详情、素材、变量和字体。
• 基于设计要求生成页面方案并提交内联 HTML 到画布。
• 创建组件，更新、替换或删除节点，更新或删除变量。
• 检查生成结果和设计差异。
• 检查本地 Canvas MCP 运行状态。
• 支持 macOS、Windows 和 Linux，以及 x64、arm64 架构。

安装与升级

需要 Node.js 22.19 或更高版本。

corepack enable
npx @deepseek-ai/dsh plugin --profile web add @mastergo/dsh-canvas
npx @deepseek-ai/dsh web

安装后，在同一台电脑上打开目标 MasterGo Web 文件。只有需要读取或修改 当前选择内容时才需要预先选中节点。

npx @deepseek-ai/dsh plugin --profile web update @mastergo/dsh-canvas
npx @deepseek-ai/dsh plugin --profile web remove @mastergo/dsh-canvas

使用方法

日常使用只需要：打开目标 MasterGo Web 文件；如果要处理现有内容，就先在 画布中选中对应节点；然后在 Harness 会话中说明目标、限制和是否允许修改。 不需要记住插件名或工具名。

以下内容可以直接作为会话提示词：

确认连接

我已经在这台电脑上打开了 MasterGo 文件。先确认你能否读取当前画布； 如果不能，请告诉我需要打开或刷新什么。

分析选中的页面

先在 MasterGo 中选中页面、Frame 或一组节点，然后说：

我选中了订单详情页。请按照页面层级、布局、间距、颜色、字体和组件复用 情况做一份总结。先分析，不要修改画布。

检查视觉问题

检查我选中区域的对齐、间距、字号层级和颜色使用，列出明显问题并给出 修改建议。同时截取当前选中区域供我核对，先不要修改。

查询可复用内容

查看当前文件可用的组件库、颜色变量、字号和字体。我要搭建一个 B2B 表单页，请告诉我应该优先复用哪些内容，并说明原因。

创建新页面

在当前画布中做一个 1440 像素宽的 B2B 数据看板，包含顶部导航、四张 指标卡、趋势图区域和订单表格。使用浅色背景、8 像素间距体系，并优先 复用当前文件已有的组件和变量。先说明页面结构，再创建到画布中。

修改当前选择

我已经选中顶部导航。保持整体尺寸和现有文案不变，增强当前菜单项的状态， 统一左右间距，并让操作按钮更突出。完成后告诉我改了哪些内容。

如果只希望讨论方案，请在请求末尾补充“先给修改方案，不要直接改画布”。

获取实现参考并复查

读取我选中的区域，整理一份 React 实现参考，说明主要布局、组件拆分、 样式变量和响应式注意点，不需要修改画布。

检查刚刚完成的页面是否符合前面的要求，重点看层级、间距、组件复用和 视觉一致性。先列出差异；明确的小问题可以直接修复，涉及内容取舍时先问我。

推荐的完整流程是：打开文件并确认连接 → 选中现有页面并分析 → 确认修改方向 → 执行修改 → 再做一次截图和差异检查。

开发者参考：底层能力范围

普通用户不需要使用下面的名称；它们只用于兼容性排查和版本边界确认。

| 范围 | 工具 | | --- | --- | | 指引与版本 | get_guidelines、get_version | | 页面设计与提交 | design_page、submit_page_to_canvas、agent_create_component | | 组件库与设计系统 | get_library_list、get_component_info、get_component_catalog、get_component_details、get_library_assets、get_variables、get_fonts | | 读取与检查 | get_selection_node、get_frontend_code、get_screenshot、review_generated_page、get_design_diff | | 画布编辑 | agent_update_node、agent_replace_node、agent_remove_node、agent_update_variables、agent_remove_variable |

submit_page_to_canvas 只接受 code 参数中的内联 HTML，不读取本地 HTML 文件路径。

本地运行方式

首次使用时，插件会检查本地 Canvas 服务。MasterGo 客户端已经启动兼容服务时 直接复用；没有兼容服务时，插件会校验、安装并启动当前平台对应的 mgmcp-dsh。

• 复用 MasterGo 客户端的 protocol 10+ 标准 mgmcp，兼容客户端与 DSH 同时运行的场景。
• 两种实例同时存在时，每次画布操作前都会重新发现本机运行时：优先选择已经 连接画布的实例；都未连接时优先选择客户端实例。端口只用于发现，不用于 判断实例身份。
• 插件自行管理的 mgmcp-dsh 仍要求 protocol 11+ 和本地访问密钥。
• 插件不会停止、替换或升级 MasterGo 客户端启动的 mgmcp。
• 启动锁会避免多个 DSH 进程重复拉起 Sidecar。
• Harness 退出后保留 mgmcp-dsh，供后续 DSH 进程复用。
• Sidecar 启动失败只停用 Canvas 工具，不影响其他 Harness 能力。

mastergo_canvas_status 会实时报告当前选中的实例、实际端口以及画布连接状态。 遇到“没有活动画布”时，请打开或刷新目标 MasterGo Web 文件；遇到“选择内容 为空”时，请先在 MasterGo 中选中目标节点。

普通用户不需要配置二进制路径、本地 URL 或端口。

支持

• 公开文档：https://github.com/mastergo-design/dsh-canvas
• 问题反馈：https://github.com/mastergo-design/dsh-canvas/issues
• DSH 社区发布：https://github.com/deepseek-ai/deepseek-harness/discussions/4762

English

@mastergo/dsh-canvas connects DeepSeek Harness to a MasterGo Web canvas open on the same computer. The npm package includes and manages a DSH-specific mgmcp-dsh; users do not need the MasterGo desktop client, a separate MCP binary download, or manual port configuration.

Capabilities in this release

• Read selected canvas nodes, screenshots, and frontend code.
• Inspect libraries, component details, assets, variables, and fonts.
• Produce page designs and submit inline HTML to the canvas.
• Create components; update, replace, or remove nodes; and update or remove variables.
• Review generated results and design differences.
• Check the local Canvas MCP runtime status.
• Run on macOS, Windows, and Linux on x64 and arm64.

Install and update

Node.js 22.19 or newer is required.

corepack enable
npx @deepseek-ai/dsh plugin --profile web add @mastergo/dsh-canvas
npx @deepseek-ai/dsh web

After installation, open the target MasterGo Web file on the same computer. Preselect nodes only for operations that should read or modify the current selection.

npx @deepseek-ai/dsh plugin --profile web update @mastergo/dsh-canvas
npx @deepseek-ai/dsh plugin --profile web remove @mastergo/dsh-canvas

Usage

Open the target MasterGo Web file, select relevant nodes when working with existing content, and describe the goal, constraints, and editing permission in the Harness conversation. You do not need to remember a plugin or tool name.

The following prompts can be used directly.

Confirm access

I have opened the MasterGo file on this computer. First confirm whether you can read the current canvas. If not, tell me what I need to open or refresh.

Analyze a selected page

Select a page, frame, or group of nodes in MasterGo, then say:

I selected the order-details page. Summarize its hierarchy, layout, spacing, colors, typography, and component reuse. Analyze it first and do not change the canvas.

Check visual issues

Check the selected area for alignment, spacing, type hierarchy, and color usage. List clear issues and suggest fixes. Capture the selected area for verification, but do not edit it yet.

Find reusable content

Inspect the libraries, color variables, type styles, and fonts available in this file. I am building a B2B form page; tell me what I should reuse and why.

Create a new page

Create a 1440-pixel-wide B2B analytics dashboard on the current canvas. Include a top navigation bar, four metric cards, a trend area, and an orders table. Use a light background and an 8-pixel spacing system, and reuse existing components and variables where possible. Explain the structure first, then create it.

Modify the current selection

I selected the top navigation. Keep its overall size and copy, strengthen the active-item state, make the horizontal spacing consistent, and give the action button more emphasis. Tell me what changed when you finish.

Add “propose the changes first; do not edit the canvas yet” when you want approval before execution.

Get implementation guidance and review the result

Read the selected area and prepare a React implementation reference. Explain the main layout, component breakdown, style variables, and responsive considerations. Do not change the canvas.

Check whether the page we just completed meets the earlier requirements. Focus on hierarchy, spacing, component reuse, and visual consistency. List differences first. Fix unambiguous small issues, but ask me before making content tradeoffs.

The recommended flow is: open the file and confirm access → select and analyze an existing page → approve a direction → apply the change → run a final screenshot and difference review.

Developer reference: underlying capability scope

Regular users do not need the names below. They are provided only for compatibility debugging and release-boundary checks.

| Area | Tools | | --- | --- | | Guidance and version | get_guidelines, get_version | | Design and submission | design_page, submit_page_to_canvas, agent_create_component | | Libraries and design system | get_library_list, get_component_info, get_component_catalog, get_component_details, get_library_assets, get_variables, get_fonts | | Read and review | get_selection_node, get_frontend_code, get_screenshot, review_generated_page, get_design_diff | | Canvas edits | agent_update_node, agent_replace_node, agent_remove_node, agent_update_variables, agent_remove_variable |

submit_page_to_canvas accepts inline HTML through its code argument and does not read a local HTML file path.

Local runtime behavior

On first use, the Bundle checks for a compatible local Canvas service. It reuses one already started by MasterGo Client; otherwise it verifies, installs, and starts the packaged mgmcp-dsh for the current platform.

• A protocol 10+ standard mgmcp started by MasterGo Client is reused so the client and DSH can run together.
• When both runtime types exist, the Bundle rediscovers them before canvas operations and follows the runtime that already owns an online canvas. If neither is connected, the client runtime wins. Ports are discovery inputs, not runtime identities.
• A plugin-managed mgmcp-dsh still requires protocol 11+ and a local access key.
• The Bundle never stops, replaces, or upgrades the mgmcp process owned by MasterGo Client.
• A startup lock prevents concurrent DSH processes from launching duplicate sidecars.
• mgmcp-dsh remains running after Harness exits so later DSH processes can reuse it.
• A sidecar startup failure disables Canvas tools without disabling unrelated Harness capabilities.

mastergo_canvas_status reports the selected runtime, actual endpoint, and live canvas connection state. If an operation reports no active canvas, open or refresh the target MasterGo Web file. If the selection is empty, select the intended nodes in MasterGo first.

Normal users do not configure a binary path, local URL, or port.

Support

• Public documentation: https://github.com/mastergo-design/dsh-canvas
• Issues: https://github.com/mastergo-design/dsh-canvas/issues
• DSH community post: https://github.com/deepseek-ai/deepseek-harness/discussions/4762