lovstudio/dsh-frontend-inspector

dsh-frontend-inspector

面向 DeepSeek Harness Web 界面的生产环境点击即跳转源码功能。在渲染出的元素上按住 Lovinsp 快捷键，即可定位或复制其原始源码位置。

这是 @lovstudio 作用域下的一个 Lovstudio 插件。它不会修改或重新构建 DeepSeek Harness 仓库内的文件。

架构

当前的 DSH Web 会链接预构建的包产物，并通过 Client Module Registry 提供运行时 dsh.client 包。因此，仅依赖运行时的 React _debugSource 读取器无法检查生产环境的 UI。

本插件改用受支持的 Host 扩展点：

- 一个常驻的 Vite 进程读取干净的 DSH 检出，并将启用了 Lovinsp 的 shell 写入 DSH_HOME/cache/frontend-inspector/dist。
- shell 构建通过相邻的 source map 映射编译后的 JSX 调用，并生成指向原始 .tsx 文件的 data-insp-path 值。
- webServer.tapIndex() 保留 DSH 的身份验证和启动数据注入，仅替换 shell 的资源标签。
- /lovinsp-shell/ 将外部 shell 缓存作为命名路由提供，优先于官方静态回退。
- /lovinsp-plugins/ 代理 Client Module Registry 的组合包，应用其带索引的 source map，并为独立插件（如 Plugin Marketplace）添加源码标记。
- Lovinsp 桥接随 Vite watcher 保持存活，并随 DSH 插件生命周期停止。
- 在没有检出（npx 模式）时，上述内容均不会运行：@lovinsp/core 生成的覆盖脚本会被内联到索引页面中，而 /lovinsp-plugins/* 则根据区域标记和包清单而非 source map 来标记包。组合中的每个插件都会依据其自身的仓库和发布版本进行标记，因此第三方插件也能与 harness 一同被覆盖。

DSH 检出是只读输入。生成的文件、Vite 缓存和 Lovinsp 状态都保存在 DSH_HOME/cache/frontend-inspector 下。

安装

两种模式，在启动时自动选择：

| | 源码检出 | 纯 npx @deepseek-ai/dsh |
|---|---|---|
| 标记 | 来自 source map 的精确 TypeScript 文件:行:列 | 仅文件，来自 tsdown 留在已发布包中的 //#region 标记 |
| 点击 | 在你的编辑器中打开文件（editor，默认为 vscode） | 在 GitHub 上打开文件，位于每个包自身仓库的已安装发布版本中 |
| Shell | 由 Vite 重新构建一次，并在 shell 自身的元素上带有标记 | 不受影响；只有插件包（几乎所有 UI 都在其中）带有标记 |
| 要求 | 一个 harness 检出；Vite 从其 apps/web 中解析 | 除插件本身外无其他要求 |
两种模式下的快捷方式：按住 Shift+Option（Windows：Shift+Alt）并移动鼠标以高亮某个元素，然后点击——源码检出模式会打开你的编辑器，npx 模式会复制源码 URL。在 npx 模式下，额外加上 Command（Windows：Ctrl）则改为在 GitHub 上打开该文件。npx 模式还会在首次加载时以短暂提示的形式显示一次该组合键，因为覆盖层在按键被按住之前是不可见的。

从源码检出（精确位置，跳转到编辑器）：

git clone --depth 1 --branch dsh-v0.1.2-rc.1 https://github.com/deepseek-ai/deepseek-harness.git
cd deepseek-harness && pnpm install && pnpm run build
pnpm dsh plugin --profile web add -w github:lovstudio/dsh-frontend-inspector#v0.1.7
pnpm dsh web

检出目录按以下顺序查找：sourceRoot、DSH_SOURCE_ROOT 或启动目录；生成的文件保留在 DSH_HOME/cache/frontend-inspector 下。

没有检出（文件级，跳转到 GitHub）：

npx @deepseek-ai/dsh plugin --profile web add -w github:lovstudio/dsh-frontend-inspector#v0.1.7
npx @deepseek-ai/dsh web

加载器组合中的每个包都会根据其自身清单中的 repository 进行标记，因此点击 Plugin Marketplace 会打开 Plugin Marketplace，点击聊天外壳会打开 harness。对于 harness 包，ref 是 harness 的 sourceRef；对于其他所有包，ref 是 v——即 npm 发布工作流推送的标签；refs 可以覆盖任何采用不同标记方式的包：

- id: frontend-inspector
name: '@lovstudio/dsh-frontend-inspector'
config:
refs:
some-plugin: main

如果一个包没有声明 repository，或者声明的 repository 无法解析到 git 主机，则该包保持未标记状态，而不是链接到错误的位置。

配置

| 字段 | 默认值 | 含义 |
|---|---:|---|
| enabled | true | 构建并提供插桩后的 Web 界面。 |
| sourceRoot | auto | 用作只读源码的干净 DeepSeek Harness 检出。 |
| port | 5678 | Lovinsp 可用端口搜索的起始端口。 |
| editor | vscode | 传递给 Lovinsp 的编辑器标识符。 |
| startupTimeoutMs | 120000 | 首次插桩构建的截止时间（检出模式）。 |
| repository | harness repo | npx 模式：哪个仓库算作 harness，其包使用 sourceRef。 |
| sourceRef | dsh-v | npx 模式：harness 仓库的 git ref；当无法读取正在运行的 dsh 版本时，回退到 master。 |
| refs | {} | npx 模式：按包名指定的 git ref，覆盖推导出的 v。 |

frontend-inspector.enabled 设置部分可以在不卸载该 bundle 的情况下禁用索引路由。

使用
Lovinsp 在页面上渲染其开关。在 checkout 模式下，默认操作是 IDE 定位，标记同时覆盖官方 shell 和插件包（来自它们的 source map）。在 npx 模式下，默认操作是复制源 URL，Command 会将其提升为 GitHub 跳转，标记仅覆盖插件包，这些标记从 tsdown 在已发布的 lib/client.js 中留下的 //#region 文件标记解析而来（自身文件将 lib/types//x.js 映射回 src//x.tsx）。URL 不携带行号：已发布的包不附带 source map，因此只有文件是精确的。自动 JSX 运行时和 React.createElement 都能被识别。两种模式下都启用了复制。

本地开发

将此 checkout 保持在 DeepSeek Harness 仓库之外：

pnpm install
pnpm run watch

包监听器会重新构建 Host 插件。当 DSH 客户端产物发生变化时，插件自有的 Vite 监听器会重新构建外部 shell。更改 Host 代码或运行器后，请重启 DSH。

许可证

MIT