CodeLog+ is a powerful and customizable VSCode extension designed to streamline debugging by quickly inserting formatted log statements into your code. This extension supports multiple programming languages and allows you to configure templates to match your preferred logging style.
- CodeLog+
- Multi-language support - Works with JavaScript, TypeScript, Java, C#, PHP, Dart, Python, C++, Ruby, and Go.
- Customizable log templates - Define your own log message format.
- Automatic file & line detection - Inserts file name and line number dynamically.
- Quick insert with shortcuts - Add log statements with minimal effort.
- Intelligent variable logging - Automatically logs variable names and values.
- Flexible configuration options - Tailor the behavior to your needs.
- Open VSCode.
- Go to Extensions (
Ctrl+Shift+XorCmd+Shift+Xon macOS). - Search for
CodeLog+. - Click Install.
- Start using it right away!
- Place your cursor on a variable or function.
- Use the shortcut:
- Windows/Linux:
Ctrl+Alt+L - Mac:
Cmd+Option+L
- Windows/Linux:
- A formatted log statement will be inserted automatically.
console.log("🔍 ~ myFile.js:25 ~ userName:", userName)print(f"🔍 ~ myFile.py:25 ~ userName: {userName}")CodeLog+ provides various configuration options to customize logging behavior in VSCode. You can modify these settings in the VSCode settings.json file.
| Setting | Type | Default | Description |
|---|---|---|---|
codeLogPlus.enable |
boolean | true |
Enables or disables CodeLog+ features. |
codeLogPlus.defaultLanguage |
string | javascript |
Default language for log statements. |
codeLogPlus.logCommand |
string | console.log |
The command used for logging. |
codeLogPlus.isLogMessageWrapped |
boolean | false |
Determines whether log messages should be wrapped. |
codeLogPlus.logMessagePrefix |
string | 🔍 |
Prefix for log messages. |
codeLogPlus.messageLogDelimiter |
string | ~ |
Delimiter for log messages. |
codeLogPlus.messageLogSuffix |
string | : |
Suffix for log messages. |
codeLogPlus.isSemicolonRequired |
boolean | false |
Whether a semicolon should be added at the end of log statements. |
codeLogPlus.addEmptyLineBeforeLogMessage |
boolean | false |
Adds an empty line before log statements. |
codeLogPlus.addEmptyLineAfterLog |
boolean | false |
Adds an empty line after log statements. |
codeLogPlus.useSingleQuotes |
boolean | false |
Uses single quotes for strings in log messages. |
codeLogPlus.literalOpen |
string | { |
Character(s) used to open template literals. |
codeLogPlus.literalClose |
string | } |
Character(s) used to close template literals. |
codeLogPlus.highlightColor |
string | "#FFD700" |
Color used for highlighting log statements. |
codeLogPlus.highlightStyle |
string | "wavy" |
Style used for highlighting log statements. |
codeLogPlus.customLogTemplates |
array | [] |
Custom log templates for different languages. |
CodeLog+ supports multiple programming languages for log generation:
- JavaScript (
javascript) - TypeScript (
typescript) - Java (
java) - C# (
csharp) - PHP (
php) - Dart (
dart) - Python (
python) - C++ (
cpp) - Ruby (
ruby) - Go (
go)
Users can define custom log templates using Mustache syntax. Example:
"codeLogPlus.customLogTemplates": [
{
"language": "javascript",
"template": "{{{logCommand}}}({{{quote}}}{{{logMessagePrefix}}}{{{fileName}}}:{{{lineNumber}}} → {{{variableName}}}{{{quote}}});\n"
},
{
"language": "python",
"template": "{{{logCommand}}}({{{quote}}}{{{logMessagePrefix}}}{{{fileName}}}:{{{lineNumber}}} → {{{variableName}}}{{{quote}}})\n"
}
]When defining custom templates, you can use the following variables:
| Variable | Description |
|---|---|
indent |
The indentation level of the log statement. |
logCommand |
The logging command (e.g., console.log, print). |
quote |
Single or double quotes based on settings. Escape this value to prevent HTML entity conversion. |
logMessagePrefix |
The prefix set for log messages. |
messageLogDelimiter |
The delimiter between log elements. |
fileName |
The name of the file where the log is inserted. Escape this value to prevent HTML entity conversion. |
lineNumber |
The line number where the log is inserted. |
functionName |
The name of the function where the log is inserted. |
variableName |
The name of the variable being logged. |
messageLogSuffix |
The suffix added to log messages. |
literalOpen |
The opening character(s) for template literals. |
literalClose |
The closing character(s) for template literals. |
- Escape special characters: Variables like
quoteandfileNamemay be converted into HTML entities. Use appropriate escaping mechanisms to avoid issues. - Ensure syntax correctness: Different languages require different concatenation methods (
+for Java,.for PHP, etc.). - Use delimiters wisely: The
messageLogDelimitersetting helps maintain readable logs across different formats.
By customizing these options, you can tailor CodeLog+ to fit your workflow seamlessly.
| Function | Windows/Linux | macOS |
|---|---|---|
| Insert Log | Ctrl+Alt+L |
Cmd+Alt+L |
| Remove All Logs | Ctrl+Alt+Shift+L |
Cmd+Alt+Shift+L |
| Highlight Logs | Ctrl+Alt+K |
Cmd+Alt+K |
| Clear Highlights | Ctrl+Alt+Shift+K |
Cmd+Alt+Shift+K |
| Comment Logs | Ctrl+Alt+, |
Cmd+Alt+, |
| Uncomment Logs | Ctrl+Alt+Shift+, |
Cmd+Alt+Shift+, |
You can also customize these shortcuts in the VSCode settings.
If you encounter any issues or have suggestions for improvements, please open an issue on GitHub.
If you enjoy using CodeLog+, please consider leaving a review on the VSCode Marketplace.
Stay updated on the latest features, improvements, and future projects by following me:
This extension was created using VSXpert, a template designed to help you quickly create Visual Studio Code extensions with ease.
Explore other extensions developed by me:
- Angular File Generator
- NestJS File Generator
- T3 Stack / NextJS / ReactJS File Generator
- JSON Flow
- Auto Barrel
- CodeIgniter 4 Spark
We welcome contributions from the community! To contribute, fork the GitHub repository and submit a pull request.
Before contributing, please review our Contribution Guidelines for details on coding standards and best practices.
We strive to create a welcoming, inclusive, and respectful environment for all contributors. Please read our Code of Conduct before participating in this project.
See the full list of changes in the CHANGELOG.md file.
This extension is licensed under the MIT License. See the MIT License for more details.