🧭 Functions Navigator
Instantly browse, filter, and jump between functions in your code — across PHP, JavaScript, TypeScript, and Python — all from a sleek tree view right inside the VS Code Explorer.
Make sense of large files in seconds. Save time. Stay in flow.
✨ Features
- 🗂️ Explorer Integration – View all functions in a structured tree sidebar
- ⚙️ Multi-Language Support – PHP, JavaScript, TypeScript, and Python
- ⚡ One-Click Navigation – Jump directly to any function with a click
- 🧩 Lightweight & Fast – Zero external dependencies
🖼️ Preview
Quickly jump to functions without unnecessary scrolling through files
💡 Why Developers Love It
“Finally, a clean and fast way to see my project’s structure at a glance.”
- Makes refactoring large files painless
- Perfect for onboarding into unfamiliar codebases
- Keeps your workflow focused — no manual scrolling needed
⚙️ Commands
| Command |
Description |
Function Tree: Navigate to Function |
Open function tree and jump to a function |
Function Tree: Refresh |
Refresh the current function list |
Function Tree: Debug Tree |
Log internal tree data for debugging |
📁 File & Folder Management
Easily organize your project directly from the Functions Navigator view.
📝 Creating Files or Folders
You can quickly create new files or folders within the Explorer sidebar:
- Right-click on the folder where you want to add a new item.
- Choose either “New File” or “New Folder” from the context menu.
- Enter a name (for files, include the extension — e.g., index.js, app.py).
- Press Enter — your new item will appear instantly in the tree view.
- If it’s a file, it will open automatically in the editor.
- If it’s a folder, it will expand right under the selected directory.
💡 Tip: You can also create nested files by typing paths like components/Button.jsx directly.
📸 Screenshot Example:
🔧 Configuration
| Setting |
Description |
Default |
functionTree.enabled |
Enable/disable function display |
true |
functionTree.filterRegex |
Regex to filter visible functions |
"" |
functionTree.pythonMaxDepth |
Max nested depth for Python |
5 |
🚀 Installation
Install directly from the Visual Studio Marketplace or search for “Functions Navigator” inside VS Code.
ext install CodeUnit-TL.function-tree
⭐ Support the Project
If Functions Navigator makes your workflow smoother, please consider supporting it — it really helps!
Your feedback and encouragement keep the project improving. 🙌
