Skip to content
| Marketplace
Sign in
Visual Studio Code>Debuggers>Debug Log ViewerNew to Visual Studio Code? Get it now.
Debug Log Viewer

Debug Log Viewer

logviewer

| (0) | Free
实时捕获 VSCode 调试控制台日志,提供结构化 UI、级别高亮、关键字/级别/正则多维过滤、搜索定位与虚拟滚动;支持 Flutter/Android 日志前缀清理与 OUTPUT 颜色自定义。
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Debug Log Viewer

实时捕获 VSCode 调试控制台日志,用结构化、可过滤、可搜索的面板替代原始控制台输出,让高频调试日志看得清、找得到、不卡顿。

category license

功能特性

  • 实时同步:通过 VSCode Debug API(DAP output 事件、自定义调试事件)与文件监听(fs.watch tail)三种通道捕获日志,调试一开始即在后台运行,不丢日志。
  • 结构化 UI 与级别高亮:TRACE / DEBUG / INFO / WARN / ERROR / FATAL / OUTPUT 各级别用图标与圆点配色区分;可选让正文文字也按级别上色。
  • 多维过滤:关键字、日志级别、正则表达式(多条件可用 | 组合)自由叠加。
  • 搜索与定位:全文搜索,上一条 / 下一条快速跳转,命中处高亮。
  • 虚拟滚动:仅渲染可视区域,数万条日志也流畅;支持自动换行。
  • Flutter / Android 友好:一键隐藏 I/flutter ( 5959):、 flutter: 等前缀;可组合显示「全部 / 时间 / 包名」。
  • OUTPUT 颜色自定义:大多数日志是 OUTPUT 级别,可在工具栏用调色板选取,或在设置 debugLogViewer.outputColor 中填写任意 CSS 颜色(#b9b9b9、rgb(...)、lightgreen 等)。
  • [GETX] 自动归类:以 [GETX] 开头的日志统一归类为 WARN,便于关注路由/状态变化。
  • 文件监听:粘贴日志文件绝对路径,实时 tail 追加内容。
  • 复制隔离:单行文本选择不会误选其它行。

使用方式

  1. 用 VSCode 打开本扩展后,启动任意调试会话(如 Flutter / Dart / Node),Debug Log Viewer 面板会在调试开始时自动打开。
  2. 若需手动打开:命令面板执行 Debug Log Viewer: 打开日志面板。
  3. 监听日志文件:在工具栏「日志文件绝对路径」输入框填入路径,点击「监听文件」。

命令

命令 说明
Debug Log Viewer: 打开日志面板 打开 / 聚焦日志面板
Debug Log Viewer: 清空当前会话日志 清空当前已捕获的日志

设置项

设置 默认值 说明
debugLogViewer.outputColor #b9b9b9 OUTPUT 级别日志的显示颜色,支持任意 CSS 颜色值。也可在面板工具栏用「输出色」调色板直接选取。

工具栏说明

  • 搜索 / ↑ / ↓:在当前日志中检索并逐条跳转。
  • 级别徽章:点击切换显示 / 隐藏对应级别。
  • 关键字 / 正则:维度过滤;勾选「正则」后按正则匹配(多条件用 | 分隔)。
  • 全部 / 时间 / 包名 / 去前缀 / 自动换行 / 自动滚动:行内列显隐与展示模式,可组合。
  • 输出色:原生调色板,选取 OUTPUT 级别颜色。
  • 监听文件 / 清空:tail 日志文件 / 清空面板。

已知限制

  • 启动前的历史调试输出不会回灌(捕获从扩展激活后开始)。
  • 面板为内存视图,刷新 / 重载窗口会清空当前会话日志。

发布说明

0.1.0

  • 首次发布:实时捕获、结构化 UI、级别高亮、多维过滤、搜索定位、虚拟滚动、Flutter/Android 前缀清理、OUTPUT 颜色自定义、[GETX] 自动归类、文件 tail。

许可证

MIT

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2026 Microsoft