火山表格源码预览器 (Volcano WSV Preview)

在 VSCode 中预览火山 wsv 源码文件，提供表格化的代码可视化效果，与火山 IDE 中的显示效果一致。

🌋 火山官方网站：www.voldp.com | 社区论坛：bbs.voldp.com

功能特性

表格化预览：将火山 wsv 源码解析为结构化表格，包含包、类、成员变量、常量、方法等节点
语法高亮：支持关键字、字符串、注释等语法高亮
折叠/展开：支持节点折叠和展开，方便浏览大型文件
复制源码：一键复制原始源码到剪贴板
自动预览：支持打开 .wsv 文件时自动显示预览（可在设置中开启）
右键菜单：在编辑器或资源管理器中右键即可预览
快捷键支持：Ctrl+Shift+V 预览，Ctrl+K V 侧边预览
UTF-8 编码：使用 UTF-8 编码读取文件
跨平台：支持 Windows、macOS 和 Linux

安装

方式一：从 .vsix 文件安装

或在 VSCode 中：

打开扩展面板 (Ctrl+Shift+X)
点击右上角 ... 菜单
选择「从 VSIX 安装」
选择 .vsix 文件

使用方法

打开任意 .wsv 文件
通过以下方式触发预览：
- 快捷键：Ctrl+Shift+V（当前面板预览）或 Ctrl+K V（侧边预览）
- 命令面板：Ctrl+Shift+P 输入「火山: 预览源码」
- 右键菜单：在编辑器或资源管理器中右键选择「火山: 预览源码」
- 编辑器标题栏：点击预览图标

设置项

火山 WSV: 自动预览 (volcanoWsv.autoPreview)
- 打开 .wsv 文件时自动显示预览
- 默认：false
- 开启后，打开 .wsv 文件会自动在侧边栏显示预览，你可以手动切换回文本代码视图

架构设计

插件采用 扩展宿主 + Webview 双进程架构：

┌─────────────────────────────────────────────────────┐
│                   VSCode 扩展宿主                     │
│                                                       │
│  extension.ts                                         │
│    └─ 注册命令 (volcanoWsv.preview)                    │
│                                                       │
│  wsvPreviewProvider.ts                                │
│    ├─ 读取 .wsv 文件 (UTF-8)                           │
│    ├─ VolParser.parse() → VolPackage                  │
│    ├─ convertVolToProjectData() → ProjectData          │
│    └─ panel.webview.postMessage() ──────┐             │
│                                          │             │
└──────────────────────────────────────────┼─────────────┘
                                           │ postMessage
┌──────────────────────────────────────────┼─────────────┐
│                   Webview                │             │
│                                          ▼             │
│  webview-main.ts                                        │
│    ├─ 接收 ProjectData + rawSource                      │
│    └─ VolRenderer.render()                              │
│        ├─ renderPackage()  → 包表格                     │
│        ├─ renderClass()    → 类表格                     │
│        ├─ renderMethod()   → 方法表格 + 代码体           │
│        ├─ renderFieldGroup()  → 变量表格                │
│        └─ renderConstantGroup() → 常量表格              │
└─────────────────────────────────────────────────────────┘

核心模块说明

1. VolParser (`src/volparser/parser.ts`)

火山源码解析器，负责将 wsv 文本解析为结构化的 VolPackage 对象。

解析流程：

解析文件头部 <火山程序类型="..." 版本=... />
解析包定义 包包名 < 属性... >
逐行解析包体内容：
- 类定义 类类名 < 属性... > { ... }
- 变量定义 变量变量名 < 类型=... 值=... >
- 常量定义 常量常量名 < 类型=... 值=... >
- 方法定义 方法方法名 < 属性... > 参数... { 方法体 }
- 嵌入式代码 # @begin ... # @end
- 注释 # 注释内容 或 // 注释内容

回调机制： 解析器通过 ParserCallback 接口提供事件回调，支持自定义处理。

2. Adapter (`src/adapter.ts`)

数据适配器，将解析器输出的 VolPackage 转换为渲染器所需的 ProjectData 结构。

转换映射：

VolPackage → PackageNode
VolClass → ClassNode
VolVariable → FieldNode
VolConstant → ConstantNode
VolMethod → MethodNode
VolMethodParameter → ParameterNode
VolMethodBodyNode → CodeLineNode / LocalVariableNode / LocalConstantNode

3. VolRenderer (`webview-src/renderer.ts`)

DOM 渲染器，在 Webview 中将 ProjectData 渲染为表格化视图。

渲染特性：

表格化布局，每个节点类型有独立的表头和列
支持多行属性（rowspan 合并）
支持折叠/展开（toggle icon）
语法高亮（关键字、字符串、注释）
缩进辅助线
右键菜单（复制选中文本）
复制源码按钮

4. WsvPreviewProvider (`src/wsvPreviewProvider.ts`)

Webview 面板管理器，负责：

创建和管理 WebviewPanel
读取文件内容（UTF-8）
调用解析器和适配器
通过 postMessage 与 Webview 通信
处理复制源码请求

火山表格源码预览器

voldp-yobdm