大日志文件查看器

一个专业的VSCode扩展，用于快速查看和处理大型日志文件（支持几十MB甚至GB级别的文件）。提供强大的搜索、过滤、分析、标注等功能，让日志查看和问题排查变得简单高效。

核心功能

高性能加载

• 秒开大文件 - 使用虚拟滚动技术，即使GB级别的日志文件也能秒开
• 多文件同时打开 - 支持同时打开多个日志文件，每个文件在独立面板中显示，互不干扰
• 加载进度提示 - 加载大文件时显示实时进度条，包括百分比、当前行数和加载阶段
• 智能分页 - 支持自定义每页显示行数（50-1000行）
• 懒加载 - 滚动时动态加载内容，内存占用低

强大的搜索功能

• 多关键词搜索 - 默认支持通过空格分隔的多个关键词进行 AND 逻辑匹配
• 关键词搜索 - 实时搜索日志内容（输入后自动触发搜索），高亮显示匹配结果
• 当前页搜索 - 新增只在当前显示页面内搜索的功能，勾选"当前页"复选框即可快速在当前页定位
• 正则表达式 - 支持正则模式，满足复杂搜索需求
• 高级搜索 - 多条件组合搜索，支持字段级搜索（线程名、类名、方法名）和 AND/OR 逻辑
• 统一过滤系统 - 所有过滤条件（搜索、线程名、类名、方法名、日志级别）可以叠加生效，不会互相覆盖
• 智能导航 - 搜索结果可快速跳转到完整日志中的对应位置
• 智能高亮 - 自动高亮时间戳、日志级别等关键信息

智能过滤

• 日志级别过滤 - 按ERROR、WARN、INFO、DEBUG等级别过滤
• 时间范围过滤 - 按时间段筛选日志
• 折叠重复日志 - 自动识别并折叠连续重复的日志行，支持时间戳忽略；折叠组徽标会显示当前搜索命中的条数
• 全选功能 - 一键全选/取消所有过滤条件

数据分析

• 统计信息 - 查看总行数、各级别日志数量、时间范围等统计数据
• 时间线导航 - 基于全文件采样的可视化时间分布图，点击可跳转到对应时间点附近
• 位置高亮 - 时间线图上自动高亮当前浏览位置对应的时间块，一目了然
• 智能定位 - 翻页、跳转时自动更新高亮位置，始终准确反映当前所在时间段
• 日志导出 - 导出过滤后的日志到新文件

日志管理

• 按时间删除 - 删除指定时间之前/之后的日志
• 按行数删除 - 删除指定行之前/之后的日志
• 安全提示 - 删除前提供警告，避免误操作

标注功能

• 书签管理 - 为重要日志行添加书签，快速定位
• 注释功能 - 为日志行添加自定义注释，便于协作分析
• 快速跳转 - 支持跳转到指定行号

可视化增强

• 语法高亮 - JSON/XML结构化数据自动格式化显示
• 颜色标记 - 不同级别日志使用不同颜色，一目了然
• 颜色图例 - 提供颜色说明，便于理解
• 暗色主题 - 完美适配VSCode暗色主题

支持的时间格式

自动识别多种常见日志时间格式：

• 2024-01-01 12:00:00 / 2024-01-01 12:00:00.123
• 2024/01/01 12:00:00 / 2024/01/01 12:00:00.123
• [2024-01-01 12:00:00] / [2024-01-01 12:00:00.123]
• 01-01-2024 12:00:00
• 2024-01-01T12:00:00 / 2024-01-01T12:00:00.123Z (ISO 8601)

使用方法

打开日志文件

有三种方式打开日志文件：

1. 右键菜单 - 在文件资源管理器中，右键点击 .log 或 .txt 文件，选择「打开大日志文件」
2. 命令面板 - 按 Ctrl+Shift+P (Mac: Cmd+Shift+P)，输入「打开大日志文件」
3. 编辑器标题栏 - 打开日志文件后，点击编辑器右上角的图标

多文件支持：

• 可以同时打开多个日志文件，每个文件会在独立的面板中显示
• 每个面板的标题会显示对应的文件名，方便识别
• 每个面板独立管理自己的状态（书签、注释、高亮规则、搜索结果等）
• 可以在不同面板之间自由切换查看
• 关闭面板时会自动释放该文件占用的资源

搜索日志

基础搜索：

1. 在搜索框中输入关键词（停止输入一小段时间后会自动触发搜索，默认约 0.4 秒，可在设置中调整）
   • 多关键词搜索：输入多个关键词时用空格分隔（例如：error timeout），将自动进行 AND 逻辑匹配
   • 单关键词搜索：输入单个关键词即可
2. 勾选「正则」启用正则表达式模式（可选，启用时将使用正则匹配而非多关键词匹配）
3. 勾选「当前页」只在当前显示的页面内搜索（可选，适合快速在当前查看的日志中定位关键信息）
4. 如需立即搜索，可随时点击「搜索」或按回车键

搜索模式说明：

• 全局搜索（默认）：在所有日志中搜索，会显示所有匹配的结果
• 当前页搜索：只在当前显示的页面内搜索，速度更快，适合快速定位
  • 勾选"当前页"复选框后，搜索只在当前页进行
  • 搜索结果会临时替换当前页显示，可随时退出恢复原始视图
  • 支持关键词高亮显示

高级搜索：

1. 点击「高级搜索」按钮
2. 点击「添加条件」添加搜索条件，支持的条件类型：
   • 关键词搜索：支持多关键词（空格分隔）
   • 线程名搜索：精确匹配或模糊匹配线程名
   • 类名搜索：精确匹配或模糊匹配类名（如 com.example.UserService）
   • 方法名搜索：精确匹配或模糊匹配方法名
   • 日志级别过滤：选择需要的日志级别
   • 时间范围过滤：设置开始和结束时间
3. 选择条件间的逻辑关系：
   • AND（且）：所有条件都必须满足
   • OR（或）：满足任一条件即可
4. 点击「搜索」执行组合搜索

统一过滤系统：

• 所有过滤条件（基础搜索、高级搜索、线程名筛选、类名筛选、日志级别过滤等）可以叠加生效
• 例如：先通过线程名筛选某个线程，然后在搜索框输入关键词，两个条件会同时生效
• 点击「取消筛选」可以清除所有过滤条件，恢复完整日志视图

搜索结果导航：

• 快速跳转 - 点击搜索结果行号前的 图标，跳转到完整日志中的对应位置
• 右键菜单 - 右键点击搜索结果，选择「跳转到完整日志」快速定位
• 对比复制 - 搜索结果不再自动跳转，方便对比和复制多条日志内容
• 精准定位 - 跳转时会智能加载目标行附近的数据，确保准确定位到指定位置

过滤日志

按日志级别过滤：

• 在过滤面板中勾选/取消勾选 ERROR、WARN、INFO、DEBUG 等级别
• 使用「全选」快速切换所有级别

折叠重复日志：

• 勾选「折叠重复日志」自动合并连续重复的日志
• 折叠时会忽略时间戳的差异，只比较日志内容
• 点击折叠组可以展开查看详细内容

时间范围过滤：

• 使用高级搜索功能，设置开始时间和结束时间

查看统计信息

1. 点击「统计」按钮
2. 查看总行数、各级别日志数量、时间范围等信息
3. 了解日志文件的整体情况

添加书签和注释

书签功能：

1. 点击「书签」按钮
2. 添加/管理书签
3. 快速跳转到重要日志行
4. 导出书签日志：在书签管理弹窗中点击「导出书签日志」按钮，可将所有带书签的日志导出到单独文件

注释功能：

1. 点击「注释」按钮
2. 为日志行添加说明性注释
3. 方便团队协作分析问题

快速定位

1. 点击「定位」按钮
2. 输入行号
3. 快速跳转到指定位置

导出日志

导出过滤/搜索结果：

1. 使用过滤/搜索功能筛选需要的日志
2. 点击「导出」按钮
3. 导出过滤后的结果到新文件

导出书签日志：

1. 点击「书签」按钮打开书签管理
2. 点击「导出书签日志」按钮
3. 选择保存位置，系统会将所有带书签的日志导出（默认文件名：bookmarked.log）
4. 导出的日志按行号排序，便于查看和分析

删除日志

1. 点击「删除」按钮
2. 选择删除方式：
   • 按时间删除 - 删除指定时间之前/之后的日志
   • 按行数删除 - 删除指定行之前/之后的日志
3. 输入时间或行号
4. 确认操作

重要提示：删除操作会直接修改原文件且不可恢复，请务必先备份重要日志！

开发调试

环境要求

• Node.js >= 18.0.0
• VSCode >= 1.75.0
• TypeScript >= 5.0.0

安装依赖

npm install

编译项目

npm run compile

开发模式（自动编译）

npm run watch

调试扩展

1. 在VSCode中打开项目
2. 按 F5 启动扩展开发主机
3. 在新窗口中测试扩展功能
4. 修改代码后会自动重新编译（需要手动重新加载窗口）

打包发布

# 安装打包工具
npm install -g @vscode/vsce

# 打包扩展
vsce package

# 发布到市场（需要先注册发布者账号）
vsce publish

项目结构

large_log_check/
├── src/
│   ├── extension.ts          # 扩展主入口，注册命令和事件
│   ├── logViewerPanel.ts     # WebView面板管理，负责注入 HTML/CSS/JS
│   ├── logProcessor.ts       # 日志处理核心逻辑（读取、搜索、删除）
│   └── webview.html          # WebView HTML 模板（结构为主）
├── media/
│   ├── webview.css           # WebView 样式
│   └── webview.js            # WebView 前端逻辑
├── out/                      # TypeScript 编译输出目录
├── package.json              # 项目配置和依赖
├── tsconfig.json             # TypeScript 编译配置
├── .vscodeignore             # 打包时忽略的文件
└── README.md                 # 使用说明文档

技术实现

前端技术

• 虚拟滚动 - 只渲染可见区域的日志行，大幅提升渲染性能
• 分页加载 - 支持自定义每页行数，智能加载和缓存
• 异步计算 - 折叠模式下后台异步计算总页数，不阻塞UI
• 正则匹配 - 灵活的时间戳识别和内容搜索
• DOM优化 - 高效的DOM更新策略，减少重绘重排

后端技术

• 流式读取 - 使用Node.js的readline模块，按行读取文件，避免内存溢出
• VSCode Extension API - 充分利用VSCode的扩展能力
• TypeScript - 类型安全的开发体验
• WebView通信 - 前后端消息传递机制

核心算法

• 重复日志检测 - 支持1-10行长度的重复模式识别
• 时间戳去除 - 智能识别并去除5种常见时间戳格式
• 智能高亮 - 自动识别并高亮JSON/XML等结构化数据
• 增量搜索 - 流式搜索，支持大文件快速检索

可配置行为

• 搜索防抖时间 - 可在 VSCode 设置中调整搜索框输入后自动搜索的延迟
• 折叠阈值 - 可配置折叠重复日志的最小重复次数
• 时间线采样点数 - 可调整时间线的采样密度，在精度和性能之间平衡

性能表现

• ✅ GB级别日志文件秒开（不受文件大小限制）
• ✅ 支持千万行级别的日志文件
• ✅ 分页切换响应 < 100ms
• ✅ 搜索响应时间 < 3秒（取决于文件大小和搜索条件）
• ✅ 滚动流畅，无卡顿
• ✅ 内存占用低（仅加载当前页数据）
• ✅ 折叠模式异步计算，不阻塞UI

注意事项

1. 数据安全 - 删除操作会直接修改原文件且不可恢复，请务必先备份重要日志
2. 时间格式 - 如果日志没有标准时间戳，按时间删除和时间线功能可能无法正常工作
3. 搜索性能 - 搜索功能需要扫描整个文件，超大文件（>1GB）可能需要较长时间
4. 折叠功能 - 折叠重复日志时会异步计算总页数，首次计算可能需要一些时间
5. 跳转定位 - 从搜索结果跳转到完整日志时，对于超大文件（>5万行），系统会智能加载目标行附近的数据以实现精准定位
6. 浏览器兼容 - 使用VSCode内置浏览器引擎，确保VSCode版本 >= 1.75.0

已完成功能

• ✅ 虚拟滚动和分页加载
• ✅ 多文件同时打开（每个文件独立面板）
• ✅ 多种时间格式识别
• ✅ 日志级别过滤（ERROR, WARN, INFO, DEBUG）
• ✅ 正则表达式搜索
• ✅ 高级组合搜索
• ✅ 当前页搜索（快速在当前页定位）
• ✅ 统一过滤系统（所有条件可叠加生效）
• ✅ 搜索结果智能导航（跳转按钮 + 右键菜单）
• ✅ 书签和注释功能
• ✅ 日志导出（支持导出过滤结果和书签日志）
• ✅ 折叠重复日志
• ✅ 时间线可视化导航
• ✅ 时间线位置高亮指示
• ✅ 统计分析
• ✅ JSON/XML语法高亮
• ✅ 多关键词搜索
• ✅ 暗色主题适配

贡献

欢迎提交Issue和Pull Request！

如果这个项目对你有帮助，请给个Star

License

MIT License

作者

@wake

相关链接

• GitHub仓库
• VSCode市场
• 问题反馈

---

享受高效的日志查看体验！