CodePath - Visual Code Execution Path Tracker

English

CodePath is a VS Code extension that helps developers visualize and track code execution paths through interactive node-based graphs. Create, manage, and navigate through your code flow using both text and visual diagram representations.

🚀 Quick Start

1. Install: Search for "CodePath" in VS Code Extensions
2. Select Code: Highlight any code in your editor
3. Right-click: Choose "New Node" from context menu
4. Build Path: Add child/parent nodes to create execution flow
5. Visualize: View your code path in text or diagram format

📖 Documentation

• 📚 User Guide - Complete usage instructions
• 🛠️ Developer Guide - Development and contribution guide
• 📋 API Reference - Technical API documentation
• 🔧 Configuration - Settings and customization
• 🌐 Interactive Docs - Multi-language documentation portal
• 🎓 Learning Guide - In-depth guide for beginners

⚡ Key Features

• Interactive Node Creation from selected code with right-click menu
• Dual Visualization (Text + Mermaid diagrams) with instant switching
• Multiple Graph Management with quick status bar menu
• Smart Navigation with fuzzy matching and location tracking
• Auto Location Update - Intelligent code tracking with multi-strategy search
• Tree Fork Support - Track multiple execution paths for the same code
• Export/Import for team collaboration with auto-switch
• Node Editing with real-time validation and preview update
• File Explorer Integration - Preview and share graphs directly from files
• Cross-platform compatibility

🎯 Use Cases

• Debug Complex Logic - Visualize execution flow with automatic location tracking
• Code Review - Share execution paths with team via export/import
• Documentation - Generate flow diagrams with Mermaid support
• Learning - Understand complex codebases with interactive navigation
• Refactoring - Track code changes with intelligent location updates
• Multiple Scenarios - Use tree forks to explore different execution paths

中文

CodePath 是一个 VS Code 扩展，帮助开发者通过交互式节点图表可视化和追踪代码执行路径。支持创建、管理和导航代码流程，提供文本和可视化图表两种展示方式。

🚀 快速开始

1. 安装: 在 VS Code 扩展中搜索 "CodePath"
2. 选择代码: 在编辑器中高亮任意代码
3. 右键点击: 从上下文菜单选择 "New Node"
4. 构建路径: 添加子/父节点创建执行流程
5. 可视化: 以文本或图表格式查看代码路径

📖 文档

• 📚 用户指南 - 完整使用说明
• 🛠️ 开发指南 - 开发和贡献指南
• 📋 API 参考 - 技术 API 文档
• 🔧 配置说明 - 设置和自定义
• 🌐 交互式文档 - 多语言文档门户
• 🎓 学习指南 - 初学者深度指南

⚡ 核心功能

• 交互式节点创建 - 右键菜单快速创建节点
• 双重可视化 - 文本 + Mermaid 图表即时切换
• 多图表管理 - 状态栏快捷菜单快速访问
• 智能导航 - 模糊匹配和位置追踪
• 自动位置更新 - 智能代码追踪，多策略搜索
• 树分叉支持 - 追踪同一代码的多条执行路径
• 导出/导入 - 团队协作分享，自动切换
• 节点编辑 - 实时验证和预览更新
• 文件浏览器集成 - 直接预览和分享图表文件
• 跨平台 - 全平台兼容

🎯 使用场景

• 调试复杂逻辑 - 可视化执行流程，自动追踪位置变化
• 代码审查 - 通过导出/导入与团队分享执行路径
• 编写文档 - 生成 Mermaid 流程图
• 学习代码 - 交互式导航理解复杂代码库
• 代码重构 - 智能位置更新追踪代码变化
• 多场景探索 - 使用树分叉探索不同执行路径