KnitNeedle: Interactive Knit Dependency Graph for VS Code

KnitNeedle is a Visual Studio Code extension that provides a real-time, interactive visualization of your Knit dependency graph directly within your editor. Designed for Kotlin projects using the Knit DI framework, KnitNeedle helps you understand, debug, and optimize your dependency structure with instant feedback.

Features & Functionality

Automatic Graph Generation: KnitNeedle parses your project’s Knit JSON output and displays a live dependency graph in a WebView panel.
Real-Time Updates: The graph updates automatically as you edit your code, reflecting new dependencies, removals, and errors.
Interactive Exploration: Click, drag, and inspect nodes to explore relationships between components. Error nodes are highlighted, and clicking them reveals detailed diagnostics.
Error Propagation: Downstream errors are visualized, so you can see not just where a problem occurred, but also which components are affected.
Optimistic Logging: Even if compilation fails, KnitNeedle shows the classes involved in errors, making debugging easier.

Development Tools Used

VS Code Extension API: For integrating with the editor and providing the WebView UI.
TypeScript: Main language for extension logic and WebView code.
React (with react-flow): Used in the WebView for rendering and interacting with the dependency graph.
Node.js: For scripting and build tasks.
Knit (Kotlin DI Framework): Generates the dependency graph data consumed by the extension.