filetree-pro
Version:
A powerful file tree generator for VS Code and Cursor. Generate beautiful file trees in multiple formats with smart exclusions and custom configurations.
295 lines (215 loc) • 8.16 kB
Markdown
# 🌳 FileTree Pro - VS Code Extension
A powerful file tree generator for VS Code and Cursor. Generate beautiful file trees in multiple formats with smart exclusions and custom configurations.
[](https://marketplace.visualstudio.com/items?itemName=0xtanzim.filetree-pro)
[](https://marketplace.visualstudio.com/items?itemName=0xtanzim.filetree-pro)
[](https://marketplace.visualstudio.com/items?itemName=0xtanzim.filetree-pro)
[](https://marketplace.visualstudio.com/items?itemName=0xtanzim.filetree-pro)
## 📹 Demo Videos
Watch FileTree Pro in action below!
### 🧪 Demo Video
[](https://youtu.be/EvgOWywtJjU)
➡️ _Right-click any folder → Generate file tree in seconds!_
## ⚙️ Configuration
### Quick Setup
Add this to your VS Code settings (`Ctrl/Cmd + ,`):
```json
{
"filetree-pro.exclude": [
"**/node_modules/**",
"**/dist/**",
"**/.git/**",
"**/.venv/**",
"**/build/**",
"**/coverage/**",
"**/*.log",
"**/*.tmp"
],
"filetree-pro.showIcons": true,
"filetree-pro.respectGitignore": true,
"filetree-pro.useCopilot": false
}
```
### Custom Exclusions
Add your own patterns to exclude files/folders:
```json
{
"filetree-pro.exclude": [
"**/node_modules/**",
"**/my-custom-folder/**",
"**/*.test.js",
"**/temp/**"
]
}
```
## 🚀 Features
### 📁 Smart File Tree Generation
- **Right-click any folder** → Generate file tree
- **Select text** → Convert to tree format
- **4 Output Formats**: Markdown, JSON, SVG, ASCII
- **Icon Support**: Beautiful icons for all file types
- **Smart Exclusions**: Automatically excludes build files, dependencies, and temp files
### 🌍 Universal Language Support
- **50+ Programming Languages**: JavaScript, Python, Java, C++, Go, Rust, Kotlin, Scala, C#, F#, Dart, R, MATLAB, Julia, Perl, Lua, Haskell, Clojure, Elixir, Erlang, OCaml, Nim, Zig, V, Assembly, and more
- **Special Files**: Dockerfile, Makefile, README, LICENSE, CHANGELOG
- **Web Technologies**: HTML, CSS, SCSS, Vue, Svelte
- **Configuration Files**: YAML, TOML, INI, XML, JSON
### 🎨 Multiple Export Formats
| Format | Use Case | Features |
| --------------- | ----------------------- | ----------------------- |
| **📄 Markdown** | Documentation, GitHub | Icons, clean formatting |
| **📊 JSON** | APIs, Data processing | Structured data, icons |
| **🎨 SVG** | Presentations, diagrams | Visual, scalable |
| **📝 ASCII** | Universal compatibility | Plain text, portable |
### 🛡️ Smart Exclusions
Automatically excludes common build artifacts and **respects .gitignore files**:
- **Respect .gitignore**: Honors your project's .gitignore patterns
- `node_modules`, `dist`, `build`, `out`
- `.git`, `.venv`, `venv`, `env`
- `*.log`, `*.tmp`, `*.cache`
- `__pycache__`, `*.pyc`
- `target`, `bin`, `obj`
- `.DS_Store`, `Thumbs.db`
### ⚡ Performance Optimized
- **Memory Management**: Efficient for large projects
- **Async Processing**: Non-blocking tree generation
- **Loading States**: Visual feedback during processing
- **Batch Processing**: Handles 10,000+ files smoothly
## 🎯 Quick Start
1. **Install Extension**: Search "FileTree Pro" in VS Code Extensions
2. **Open Project**: Open any project folder in VS Code
3. **Generate Tree**: Right-click on any folder → "Generate File Tree"
4. **Choose Format**: Select Markdown, JSON, SVG, or ASCII
5. **Choose Style**: With or without icons
6. **Save**: The tree opens in an unsaved tab - save when ready!
## 📝 Text to Tree Conversion
**New Feature!** Convert any text list into a beautiful tree format:
1. **Select text** in any editor (file paths, folder lists, etc.)
2. **Right-click** → "Convert Text to Tree"
3. **View** the converted tree in a new tab
### 📹 Demo Video - How to convert text to tree
[](https://youtu.be/ixqyyAPhodw)
### Example Input
```
src/
main.js
utils.js
components/
Header.js
Footer.js
```
### Example Output
```
# File Tree from Text
├── 📁 src/
├── 📄 main.js
├── 📄 utils.js
├── 📁 components/
├── 📄 Header.js
└── 📄 Footer.js
*Generated by FileTree Pro Extension*
```
## 📹 Video Guide
Watch this quick demo to see FileTree Pro in action:
[](https://youtu.be/EvgOWywtJjU)
_Video shows: Right-click on folder → Generate File Tree → Choose format → View beautiful tree output_
## 📋 Commands
- `Generate File Tree` - Right-click on folder to generate tree
- `Convert Text to Tree` - Select text and convert to tree format
- `Refresh Tree` - Regenerate with current settings
- `Export Tree` - Export in different formats
## 🎨 Examples
### Markdown Output
```
# File Tree: my-project
├── 📁 src/
│ ├── 📄 main.js
│ ├── 📄 utils.js
│ └── 📁 components/
│ ├── 📄 Header.js
│ └── 📄 Footer.js
├── 📄 package.json
├── 📄 README.md
└── 📁 node_modules/ 🚫 (auto-hidden)
```
### JSON Output
```json
{
"name": "my-project",
"type": "directory",
"icon": "📁",
"children": [
{
"name": "src",
"type": "directory",
"icon": "📁",
"children": [...]
}
]
}
```
## 🔧 Advanced Configuration
### .gitignore Support
```json
{
"filetree-pro.respectGitignore": true
}
```
Automatically respects your project's `.gitignore` patterns when generating file trees. Enabled by default.
### Custom Exclusions
```json
{
"filetree-pro.exclude": [
"**/node_modules/**",
"**/dist/**",
"**/.git/**",
"**/my-custom-folder/**",
"**/*.test.js",
"**/temp/**",
"**/logs/**"
]
}
```
### Icon Settings
```json
{
"filetree-pro.showIcons": true
}
```
### Copilot Integration (Optional)
```json
{
"filetree-pro.useCopilot": false
}
```
## 🌟 Use Cases
### For Developers
- **Project Documentation**: Generate file trees for README files
- **Code Reviews**: Share project structure with team
- **Onboarding**: Help new developers understand project layout
- **Architecture Analysis**: Visualize project structure
### For Teams
- **Documentation**: Export trees for project docs
- **Presentations**: Use SVG format for slides
- **API Documentation**: JSON format for tools
- **Cross-platform**: ASCII format works everywhere
### For Educators
- **Teaching**: Show project structures to students
- **Examples**: Demonstrate different project organizations
- **Analysis**: Analyze student project structures
## 🚀 Performance
- **Small Projects** (< 1,000 files): < 1 second
- **Medium Projects** (1,000-10,000 files): < 3 seconds
- **Large Projects** (10,000+ files): < 10 seconds
## 📄 License
MIT License - see [LICENSE](LICENSE) file for details.
## ☕ Support
If you find this extension helpful, consider buying me a coffee! ☕
[](https://buymeacoffee.com/tanzimhossain)
## 📞 Contact & Social Media
- **Email**: <tanzimhossain2@gmail.com>
- **GitHub**: [@0xTanzim](https://github.com/0xTanzim)
- **LinkedIn**: [@0xtanzim](https://linkedin.com/in/0xtanzim)
- **Facebook**: [@0xtanzim](https://facebook.com/0xtanzim)
- **Instagram**: [@0xtanzim](https://instagram.com/0xtanzim)
---
**Made with ❤️ for the VS Code community**