Debug Logger - 调试日志助手

一个简单易用的VS Code扩展，帮助你快速添加和清理调试日志，让代码调试更高效！

✨ 主要功能

🚀 一键插入调试日志

按下快捷键，瞬间在光标位置插入调试日志
自动添加文件名和行号，方便定位问题
行号自动递增，每个日志都有唯一标识

🧹 一键清理调试日志

调试完成后，一键删除所有调试日志
只删除插件生成的日志，不影响你手写的代码
保持代码整洁，提交前不用担心遗留调试代码

🔄 重置行号计数

随时重置行号计数器，重新开始编号
每个文件独立计数，互不干扰

⚙️ 个性化设置

自定义快捷键，符合你的使用习惯
自定义日志格式，支持多种变量
图形化设置界面，配置简单直观

🎯 快速上手

安装扩展

打开VS Code
点击左侧扩展图标（或按Ctrl+Shift+X）
搜索"Debug Logger"
点击安装

基本使用

插入调试日志

将光标放在需要调试的代码行
按下Alt+D
调试日志自动插入！

示例效果：

function calculateTotal(items) {
    
    console.error('app.js', 1); // DEBUG-LOG
    let total = 0;
    for (let item of items) {
        
        console.error('app.js', 2); // DEBUG-LOG
        total += item.price;
    }
    return total;
}

删除调试日志

调试完成后，按下Alt+C，所有调试日志瞬间消失！

重置行号

如果想重新开始编号，按下Alt+R即可。

⌨️ 默认快捷键

快捷键	功能	说明
`Alt+D`	插入调试日志	在光标位置添加调试日志
`Alt+C`	删除调试日志	清除当前文件的所有调试日志
`Alt+R`	重置行号	重置当前文件的行号计数器

所有快捷键都可以在设置中自定义

🛠️ 个性化设置

打开设置面板

按Ctrl+Shift+P打开命令面板
输入"调试日志配置"
点击打开设置面板

自定义快捷键

在设置面板的"快捷键自定义"部分，你可以：

修改插入日志的快捷键
修改删除日志的快捷键
修改重置计数器的快捷键

快捷键格式示例：

alt+d - Alt + D
ctrl+shift+l - Ctrl + Shift + L
cmd+k - Cmd + K（Mac系统）

自定义日志格式

你可以修改日志的显示格式，支持以下变量：

${fileName} - 文件名
${lineNumber} - 行号
${timestamp} - 时间戳
${functionName} - 函数名

格式示例：

// 默认格式
console.error('${fileName}', ${lineNumber})

// 详细格式
console.log('[调试] ${fileName}:${lineNumber} 时间:${timestamp}')

// 简洁格式
console.log(${lineNumber})

📁 支持的文件类型

JavaScript (.js)
TypeScript (.ts)
React JSX (.jsx)
React TSX (.tsx)
Vue (.vue)
Svelte (.svelte)

💡 使用技巧

1. 快速定位问题

function processData(data) {
    
    console.error('utils.js', 1); // DEBUG-LOG
    if (!data) return null;
    
    
    console.error('utils.js', 2); // DEBUG-LOG
    const result = data.map(item => {
        
        console.error('utils.js', 3); // DEBUG-LOG
        return item.value * 2;
    });
    
    return result;
}

2. 调试完成后一键清理

按Alt+C，所有调试日志瞬间消失，代码恢复整洁。

3. 重新开始计数

在新的调试会话开始时，按Alt+R重置行号，从1重新开始。

❓ 常见问题

Q: 快捷键不起作用怎么办？ A: 可能与其他扩展冲突，请在设置中修改快捷键。

Q: 删除功能为什么没删除我的日志？ A: 插件只删除带有// DEBUG-LOG标记的日志，手写的日志不会被删除。

Q: 如何恢复默认设置？ A: 在设置面板点击"重置为默认"按钮。

Q: 支持其他编程语言吗？ A: 目前主要支持JavaScript相关的文件类型，后续会考虑支持更多语言。

🎉 开始使用

安装完成后，打开任意JavaScript文件，按Alt+D试试看！

让调试变得更简单！ 🚀

如有问题或建议，欢迎反馈。

Debug Logger - Debugging Log Helper

A simple and easy-to-use VS Code extension to help you quickly add and clean up debug logs, making code debugging more efficient!

✨ Main Features

🚀 One-Click Insert Debug Log

Press a hotkey to instantly insert a debug log at the cursor position.
Automatically adds the filename and line number for easy problem location.
Line numbers auto-increment, giving each log a unique identifier.

🧹 One-Click Clean Debug Logs

After debugging, delete all debug logs with a single click.
Only deletes logs generated by the plugin, without affecting your manually written code.
Keeps your code clean, so you don't have to worry about leftover debug code before committing.

🔄 Reset Line Number Count

Reset the line number counter at any time to start numbering again.
Each file has an independent counter, so they don't interfere with each other.

⚙️ Personalized Settings

Customize hotkeys to fit your habits.
Customize the log format, with support for various variables.
A graphical settings interface makes configuration simple and intuitive.

🎯 Quick Start

Install the Extension

Open VS Code
Click the Extensions icon on the left (or press Ctrl+Shift+X)
Search for "Debug Logger"
Click Install

Basic Usage

Insert Debug Log

Place the cursor on the line of code you want to debug.
Press Alt+D.
The debug log is automatically inserted!

Example:

function calculateTotal(items) {
    
    console.error('app.js', 1); // DEBUG-LOG
    let total = 0;
    for (let item of items) {
        
        console.error('app.js', 2); // DEBUG-LOG
        total += item.price;
    }
    return total;
}

Delete Debug Logs

After debugging, press Alt+C, and all debug logs will disappear instantly!

Reset Line Number

If you want to start numbering again, just press Alt+R.

⌨️ Default Hotkeys

Hotkey	Function	Description
`Alt+D`	Insert Debug Log	Adds a debug log at the cursor position
`Alt+C`	Delete Debug Logs	Clears all debug logs in the current file
`Alt+R`	Reset Line Number	Resets the line number counter for the current file

All hotkeys can be customized in the settings.

🛠️ Personalized Settings

Open Settings Panel

Press Ctrl+Shift+P to open the Command Palette.
Type "Debug Log Configuration".
Click to open the settings panel.

Customize Hotkeys

In the "Hotkey Customization" section of the settings panel, you can:

Modify the hotkey for inserting logs.
Modify the hotkey for deleting logs.
Modify the hotkey for resetting the counter.

Hotkey Format Examples:

alt+d - Alt + D
ctrl+shift+l - Ctrl + Shift + L
cmd+k - Cmd + K (for Mac)

Customize Log Format

You can modify the display format of the logs, with support for the following variables:

${fileName} - Filename
${lineNumber} - Line number
${timestamp} - Timestamp
${functionName} - Function name

Format Examples:

// Default format
console.error('${fileName}', ${lineNumber})

// Detailed format
console.log('[Debug] ${fileName}:${lineNumber} Time:${timestamp}')

// Concise format
console.log(${lineNumber})

📁 Supported File Types

JavaScript (.js)
TypeScript (.ts)
React JSX (.jsx)
React TSX (.tsx)
Vue (.vue)
Svelte (.svelte)

💡 Usage Tips

1. Quickly Locate Problems

function processData(data) {
    
    console.error('utils.js', 1); // DEBUG-LOG
    if (!data) return null;
    
    
    console.error('utils.js', 2); // DEBUG-LOG
    const result = data.map(item => {
        
        console.error('utils.js', 3); // DEBUG-LOG
        return item.value * 2;
    });
    
    return result;
}

2. One-Click Cleanup After Debugging

Press Alt+C, and all debug logs will disappear instantly, leaving your code clean.

3. Start Counting Again

At the beginning of a new debugging session, press Alt+R to reset the line numbers and start from 1.

❓ FAQ

Q: What if the hotkeys don't work? A: There might be a conflict with another extension. Please modify the hotkeys in the settings.

Q: Why didn't the delete function remove my logs? A: The plugin only deletes logs marked with // DEBUG-LOG. Manually written logs will not be removed.

Q: How do I restore the default settings? A: Click the "Reset to Default" button in the settings panel.

Q: Is support for other programming languages planned? A: Currently, it mainly supports JavaScript-related file types. Support for more languages will be considered in the future.

🎉 Get Started

After installation, open any JavaScript file and try pressing Alt+D!

Making debugging simpler! 🚀

Feedback and suggestions are welcome.

Debug Logger

Dingning