dsh-skill-lens

Readme

# dsh-skill-lens

中文 | [English](./README.en.md)

DSH 原生插件：**Skill Lens**——扫描**会话工作区**与用户 `~/.dsh` 目录中的 Agent Skill（`SKILL.md`），在 DSH Web UI 会话页签中提供：

- **技能清单**：递归发现全部 `SKILL.md`（排除 node_modules/构建/缓存等目录），支持筛选，区分"项目"与".dsh（全局）"两个扫描位置
- **概览**：frontmatter 元数据 + Markdown 渲染的 SKILL.md 正文
- **文件浏览**：真实目录树（可折叠）+ **编辑/预览切换**——编辑产生修改后可在右下角保存/取消
- **依赖图**：SKILL.md → 分类节点（文档/脚本/资产/未引用/外部）→ 实际文件叶子；支持拖拽平移、滚轮缩放，点击文件节点跳转到文件页
- **新建/导入 Skill**：从零创建或导入 `.md` / `.zip` 技能包，自动写入项目级 `.dsh/skills` 或全局 `~/.dsh`
- **删除 Skill**：删除整个技能目录

## 功能预览

### 技能清单（扫描）

![技能清单](assets/scan.png)

### 新建技能

![新建技能](assets/new-skill.png)

### 导入技能

![导入技能](assets/upload-skill.png)

### 技能概览

![技能概览](assets/overview-skill.png)

### 文件浏览（编辑/预览）

![文件浏览](assets/skill-files.png)

### 依赖图

![依赖图](assets/skill-graph.png)


---

## 安装到 DSH

前置要求：DSH（`dsh` CLI 可用）、Node ≥ 20、pnpm ≥ 10。以下均以 **web profile** 为例，其他 profile 替换 `--profile` 参数即可。

### 方式一：pnpm 安装（已发布包）

插件发布到 npm 后，直接用包名安装。`dsh plugin` 命令会把参数转发给 pnpm，并自动把声明了 `dsh.bundle.patch` 的包 reconcile 进 profile 的 bundles 列表：

```sh
dsh plugin --profile web add dsh-skill-lens@latest
```

安装完成后**重启 dsh web 会话**即可在页签栏看到 **Skill Lens**。

### 方式二：源码安装（本地开发 / 未发布版本）

```sh
git clone https://github.com/x-feichen/dsh-skill-lens.git
cd dsh-skill-lens
pnpm install
pnpm build
node scripts/deploy.mjs   # 部署到 ~/.dsh/profiles/web 并安装
```

`deploy.mjs` 做的事：把构建产物拷贝到 `~/.dsh/profiles/web/local/dsh-skill-lens`，以 `file:./local/...` 相对依赖安装进 profile，并确保其出现在 `dsh.profile.bundles` 列表中。

之后每次改代码的更新流程（改 lib 后必须重启 dsh 才生效）：

```sh
pnpm build && node scripts/deploy.mjs
```

### 验证安装

```sh
dsh --profile web --dump-config | grep skill-lens
# 出现 - id: skill-lens / name: dsh-skill-lens 行即挂载成功
```

启动 `dsh web` 后打开任意会话，页签栏出现 **Skill Lens**。扫描**当前会话工作区**目录以及`~/.dsh`

### 卸载

```sh
dsh plugin --profile web remove dsh-skill-lens
# 若使用源码部署方式，再手动删除 ~/.dsh/profiles/web/local/dsh-skill-lens
```