Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>Doc StackNew to Visual Studio Code? Get it now.
Doc Stack

Doc Stack

Aritra Naha Likhan

|
6 installs
| (0) | Free
adding documents to annoted code snippets
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Documentation Annotator Extension for VS Code

An extension that allows you to add annotations and documentation to specific code sections in your files using markdown documentation files with full image support.

Features

  • Markdown-Based Documentation: Each annotated code section gets its own markdown file with built-in styling
  • Full Image Support: Add and view images directly in your documentation files
  • Code Preview: Referenced code is automatically included in the documentation
  • Visual Indicators: Gutter icons show which code sections have documentation

Usage

  1. Add documentation:

    • Select a section of code in your editor
    • Right-click and choose "Add Documentation" from the context menu
    • A new markdown file will be created in the Documentations folder in your workspace
    • Edit the file with your documentation, including text, code, and images
  2. View documentation:

    • Hover over any annotated code line to see a preview of the documentation
    • Click the "Open Documentation File" link in the hover to open the full documentation file
    • Or right-click on an annotated line and select "Show Documentation", then choose "Open"
  3. Delete documentation:

    • Right-click on an annotated line and select "Show Documentation"
    • Choose "Delete" and confirm to remove the documentation

Image Support

Images are fully supported in the HTML documentation files:

  1. Adding Images:

    • Place your images in the automatically created Documentations/images folder
    • Reference their path in your markdown documentation files using standard markdown syntax
  2. Image Best Practices:

    • Use relative paths starting with ./images/ to ensure portability
    • Keep image file sizes reasonable for better performance
    • Add meaningful alt text for accessibility

Markdown Editing Tips

The documentation files are created with a useful template that includes:

  • Formatted code section showing the annotated code
  • Placeholder sections for documentation, images, and notes

You can edit these markdown files like any other files in VS Code, and the changes will be saved automatically.

Release Notes

1.0.1

Initial release of the Documentation Annotator Extension with markdown-based documentation and image support

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