Skip to content
| Marketplace
Sign in
Visual Studio Code>Debuggers>DebugVisionNew to Visual Studio Code? Get it now.
DebugVision

DebugVision

Manju L

| (0) | Free
AI-powered intelligent debugging for VS Code
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

🐞 DebugVision

An AI-powered debugging assistant for Visual Studio Code that explains compiler errors, generates intelligent fixes, and helps developers debug with confidence.

VS Code Extension TypeScript Node.js Ollama MIT License



📖 Overview

DebugVision is an AI-powered Visual Studio Code extension designed to make debugging faster, easier, and more educational. Instead of only displaying compiler errors, it explains why an error occurred, suggests AI-generated fixes, and enables developers to interact with an AI assistant—all without leaving the editor.

Whether you're a beginner learning programming concepts or an experienced developer looking to speed up debugging, DebugVision helps you understand errors, apply fixes confidently, and stay focused on writing better code.


✨ Features

🤖 AI Error Explanation

  • Beginner-friendly compiler error explanations
  • Explains why the error occurred
  • Provides the correct approach
  • Shows a corrected example
  • Includes programming best practices

🛠 AI Fix Suggestions

  • AI-generated fixes for compiler errors
  • Side-by-side preview before applying
  • Confidence score
  • One-click Apply Fix

💬 AI Chat

Ask follow-up questions such as:

  • Why did this error happen?
  • Explain this code.
  • Is there a better approach?
  • What does this compiler message mean?

without leaving VS Code.


⚡ Smart Performance

  • AI Explanation Caching
  • AI Fix Caching
  • Faster repeated operations
  • Reduced unnecessary AI requests

🎯 Smart Editor Integration

  • Detects active file automatically
  • Updates diagnostics while switching files
  • Works directly with VS Code Diagnostics API
  • Refreshes instantly when diagnostics change

📋 Productivity Features

  • Copy corrected code
  • Loading animations
  • Modern chat interface
  • Professional explanation layout
  • Clean UI

🏗️ Architecture

The following diagram illustrates how DebugVision processes compiler diagnostics, interacts with a local AI model through Ollama, and delivers explanations, fixes, and chat responses directly inside Visual Studio Code.

DebugVision Architecture


📸 Screenshots

🐞 Main Debug Panel

Displays all detected compiler diagnostics with quick access to AI-powered explanations and fixes.

Main Debug Panel


🤖 AI Error Explanation

Understand compiler errors with beginner-friendly explanations, examples, and best practices.

AI Error Explanation


🛠 AI Fix Preview

Preview AI-generated fixes, compare them with your current code, review the confidence score, and apply changes with one click.

AI Fix Preview


💬 AI Chat

Ask programming questions, understand compiler errors, or discuss your code directly inside VS Code.

AI Chat



🛠 Tech Stack

  • TypeScript
  • Node.js
  • Visual Studio Code Extension API
  • Ollama
  • HTML
  • CSS
  • JavaScript

🏗️ Architecture & Project Structure

extension/
│
├── src/
│   ├── ai/
│   │   ├── providers/
│   │   ├── AIService.ts
│   │   ├── PromptBuilder.ts
│   │   └── DebugSessionManager.ts
│   │
│   ├── commands/
│   │   ├── StartDebugSession.ts
│   │   └── HelloWorld.ts
│   │
│   ├── panels/
│   │   └── DebugPanel.ts
│   │
│   ├── services/
│   │   ├── DiagnosticsService.ts
│   │   ├── DiagnosticsCacheService.ts
│   │   ├── WorkspaceService.ts
│   │   ├── LoggerService.ts
│   │   └── AIFixHistoryService.ts
│   │
│   ├── types/
│   ├── utils/
│   ├── views/
│   └── extension.ts
│
├── package.json
└── tsconfig.json

📦 Install from VS Code Marketplace

Search for DebugVision in the VS Code Extensions Marketplace and install it directly from VS Code.

DebugVision uses Ollama for local AI processing. Make sure Ollama is installed and running before using AI features.

🚀 Getting Started

1. Clone the repository

git clone https://github.com/manjugowda-l/Debug_Vision.git

2. Install dependencies

npm install

3. Build

npm run build

4. Start Ollama

ollama serve

Pull the model if required:

# Pull your preferred model (example)
ollama pull <your-model >

5. Run the extension

Press

F5

to launch the Extension Development Host.


💡 Usage

  1. Open a project with compiler errors.
  2. Start DebugVision.
  3. Select an error.
  4. Click Explain for AI explanation.
  5. Click Apply Fix to preview corrections.
  6. Chat with AI for additional guidance.

🎯 Roadmap

Version 1.0

  • ✅ AI Explain
  • ✅ AI Fix
  • ✅ AI Chat
  • ✅ Explanation Cache
  • ✅ Fix Cache
  • ✅ Active File Detection
  • ✅ Modern UI

Future Improvements

  • Workspace-wide analysis
  • Persistent chat history
  • Streaming AI responses
  • Multiple AI provider support
  • Voice input
  • Cloud AI integration

🤝 Contributing

Contributions, suggestions, and feature requests are welcome.

Feel free to fork the repository and submit a pull request.


📄 License

This project is licensed under the MIT License.See the LICENSE file for details.


👩‍💻 Author

Manju Gowda

GitHub: https://github.com/manjugowda-l

Feel free to connect, raise issues, or contribute to the project.

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