[!IMPORTANT]
Beta Version: rEcomment is currently in beta. We are actively refining the rendering engine and SVG-slicing technology.
[!IMPORTANT]
NOTE: The only official version of rEcomment is published by vkhey. Beware of clones.
**rEcomment** is a powerful Visual Studio Code extension designed to make your code comments significantly more readable. Its main power lies in formatting your comments using Markdown rendering (an easy-to-read, HTML-like formatting language). Say goodbye to plain-text limitations and visualize documentation, complex math formulas, and diagrams where they belong—right next to your code.
✨ Features
- 📝 Full Markdown Support: Render headers, lists, bold/italic text, and code blocks inside comments.
- ➗ LaTeX Integration: High-fidelity math rendering using KaTeX.
- ⚡ Seamless Workflow: Comments are rendered automatically. Focus on a comment to edit the raw text; move away to see the rendered view.
- 🎨 Pixel-Perfect Alignment: Innovative SVG-slicing technology ensures rendered content aligns perfectly with your editor's line height.
- 🌍 Broadly Supported Languages: Works seamlessly out-of-the-box with Python, Ruby, Go, JavaScript, TypeScript, Java, C, C++, Rust, PHP, C#, and many more!
🚀 Usage
Wrap your Markdown content in <md> tags within comments:
Python
# <md>
# \# Algorithm Optimization
# This function implements the gradient descent update:
# $$ \theta_{j} := \theta_{j} - \alpha \frac{\partial}{\partial \theta_{j}} J(\theta) $$
#
# </md>
def gradient_descent(...):
...
Jupyter Cells
Nice and handy addition to support runnable cells in Antigravity using # %% [markdown] syntax. Content following this marker will be automatically rendered as a rEcomment block until the first non-comment line is encountered.
# %% [markdown]
# # Section Title
# This content will be rendered as Markdown.
#
#
#
# It ends when it hits the first line of code.
x = 1
TypeScript / JavaScript
/* <md>
* ## Configuration Schema
* | Property | Type | Default |
* | :--- | :--- | :--- |
* | `enabled` | `boolean` | `true` |
* </md>
*/
const config = { ... };
⚙️ Configuration
rEcomment can be toggled via your VS Code settings:
| Setting |
Type |
Default |
Description |
recomment.enabled |
boolean |
true |
Enable or disable the rendering engine. |
recomment.autoExpand |
boolean |
false |
Automatically insert empty comment lines to ensure full rendering. |
recomment.compactMode |
boolean |
true |
Force uniform font sizes for better code density. |
recomment.escapeSpecialCharacters |
boolean |
true |
Automatically escape special characters ($, _, *, etc.) when leaving a comment block to preserve literal meaning. |
⚠️ Current Limitations
When VS Code's Word Wrap feature is enabled, you may notice visual gaps or empty lines
within rendered comments. This occurs because rEcomment renders content line-by-line to
overcome other limitations of the VS Code Decoration API.
If a rendered comment is too tall, it may be cut off just before the following code. As a
temporary workaround, you can add empty comment lines to provide more vertical space.
💬 Feedback & Support
Found a bug? Have a feature request? We'd love to hear from you!
You can send feedback directly within VS Code:
- Click the Send Feedback button in the rEcomment tab.
- Use the rEcomment: Send Feedback command from the Command Palette.
- Or fill out our Online Feedback Form in your browser.
If this extension has helped make your code more readable, please consider leaving a review on the VS Code Marketplace. As an independent developer, your feedback helps me prioritize new features and keep the project growing!
Built with ❤️ .
