TreeJS 🌳

TreeJS is a Visual Studio Code extension that generates interactive dependency graphs for JavaScript. Visualize your project's architecture with beautiful, navigable dependency trees powered by React Flow.

!IMPORTANT!
This is a very early version of the project. It may break or not work as intended.

✨ Features

• Interactive Dependency Graph

  • Drag and drop nodes to customize layout
  • Zoom and pan navigation
  • Minimap for easy overview
  • Switch between vertical and horizontal layouts

• Smart Analysis

  • Supports JavaScript, JSX files
  • Detects ES6 imports
  • Handles relative and absolute imports
  • Real-time graph updates

• Developer Friendly

  • Dark mode support
  • Customizable graph layout
  • Intuitive UI controls

📦 Installation

1. Open VS Code
2. Search on the extensions for "TreeJS"
3. Hit install

🚀 Quick Start

1. Open your JavaScript project in VS Code
2. Click the TreeJS icon in the activity bar
   • Or press Ctrl+Shift+P / Cmd+Shift+P and type "Analyze tree"
3. Select a directory to analyze
4. Explore your project's dependency graph!

🤝 Contributing

Contributions are welcome! Here's how you can help:

1. Fork the repository
2. Create a feature branch

   git checkout -b feature/amazing-feature
   

3. Commit your changes

   git commit -m 'Add amazing feature'
   

4. Push to your branch

   git push origin feature/amazing-feature
   

5. Open a Pull Request

📝 Release Notes

0.0.1

• Initial release
• Basic dependency visualization
• JS/JSX file support

0.0.2

• Bug fix

🙏 Acknowledgments

• React Flow - Interactive node-based UI library
• dagre - Graph layout algorithm
• VS Code Extension API - Extension development framework
• Claude.ai - General assistance and help with boring staff like this Readme...

Made with ❤️ by DioTheDev

Report Bug · Request Feature