ClaudeMods
☰
ZH-TW
● 0 人在線上 · 瀏覽 0 次
贊助提交作品
GitHub 儲存庫 · 發布者 data-goblin

filetree

供 Claude Code 使用的 IDE 風格檔案樹,顯示 Claude 正在做什麼,以及它位於檔案中的位置。

已翻譯

關於這個 mod

Claude Code Filetree 是一個 Claude Code mod,在右側邊欄提供 IDE 風格的檔案樹。需要 Claude Code 2.1.287+、全螢幕介面(/tui fullscreen)與至少 110 欄寬的終端機,已在 Linux、macOS 與 Windows 測試。功能包括:跟隨 cwd 的互動式檔案樹(可用 /filetree <path> 釘選資料夾)、檔案樹搜尋、依檔案和資料夾顯示 Git 狀態與變更行數、在標頭顯示分支與 ahead/behind、以顏色呈現 Claude 的讀取/寫入/提交動作、透過 git 與 gh 執行 Git 和 GitHub 操作、經由 prompt.submit hook 把選取的檔案作為脈絡傳給 Claude、檔案與資料夾大小、雙擊以預設應用程式開啟、鍵盤操作、Nerd Font 圖示與純 Unicode 後備,以及在 Omarchy 上跟隨主題。安裝方式是將它加入外掛市集後安裝 filetree@claude-code-filetree,在 /config 的 filetree 區段設定,採用 MIT 授權。

安裝

請先查看作者 README,確認 marketplace 與外掛名稱;指令可能隨儲存庫結構而變動。

claude plugin marketplace add data-goblin/claude-code-filetree
claude plugin install filetree
原文 / README
<h1 align="center">Claude Code Filetree</h1> <p align="center"> An IDE-style file tree for Claude Code that shows what Claude is doing and where in files </p> <p align="center"> <img src="https://img.shields.io/badge/Claude_Code-%E2%89%A5_2.1.287-D97757?logo=claude&logoColor=fff" alt="Claude Code 2.1.287 or newer"> <img src="https://img.shields.io/badge/version-0.2.24-blue" alt="Version"> <img src="https://img.shields.io/badge/type-mod-6f42c1" alt="Claude Code mod"> <img src="https://img.shields.io/badge/license-MIT-green" alt="License"> </p> <p align="center"> <img src="media/filetree-shimmer.gif" alt="filetree shimmering the file Claude is editing" width="900"> </p>

[!NOTE] filetree is a Claude Code mod and needs Claude Code 2.1.287+. It shows in the right sidebar, which needs the fullscreen layout (/tui fullscreen) and a terminal at least 110 columns wide. Tested on Linux, macOS and Windows; mods don't load in WSL sessions of the Desktop app.


Installation

The repo is its own plugin marketplace. Run this in the terminal:

claude plugin marketplace add data-goblin/claude-code-filetree
claude plugin install filetree@claude-code-filetree

Or inside a Claude Code session:

/plugin marketplace add data-goblin/claude-code-filetree
/plugin install filetree@claude-code-filetree

Installed it as filetree@filetree before the repository was renamed? Nothing to do: that install keeps loading and keeps receiving updates.

Features

  • Interactive file tree for the working directory where you're using Claude Code; it follows the cwd, or /filetree <path> pins another folder

  • Search the file tree, including folders you have not opened yet

  • Git status per file and folder in color, with exact lines changed (+N -N) on modified files and ?:N M:N D:N file counts on folders

  • Branch, upstream and ahead/behind in the header

  • Visual indicator of Claude reads and searches (purple), writes (orange) and commits (green); collapsed folders open to show the file

    <img src="media/filetree-read.gif" alt="Files shimmer purple while Claude reads and searches them" width="800">
  • Git and GitHub operations via git and gh (commit, push, pull, checkout, merge, PR and more) shown as a status at the bottom of the pane

    <img src="media/filetree-git.gif" alt="A committed file shimmers green and the footer shows the commit" width="800">
  • Selection-aware: the selected file is passed to Claude as context through a prompt.submit hook, and @path mentions in a prompt reveal that file in the tree

    <img src="media/filetree-ask.gif" alt="Selecting config.yaml in the tree and asking Claude what it changed there" width="800">
  • File and folder sizes: the Σ header button swaps the date column for sizes; folders show their disk usage (du, or a summed listing on Windows), worked out in the background for the rows on screen and refreshed after Claude writes

  • Double-click a file to open it in its default app

  • Click to select, arrow keys to move through the tree

  • Light on large repos: outside a repo it only checks once whether one exists, and every git call is scoped to the cwd

  • Nerd Font icons with a plain Unicode fallback

  • On Omarchy, the pane takes its colors and background from the current theme and follows theme switches

Resizing the pane

You can resize the pane with the mouse, or by setting custom pane:grow or pane:shrink keybindings in keybindings.json

<p align="center"> <img src="media/filetree-resize.gif" alt="Dragging the filetree pane edge to resize it" width="900"> </p>

Settings

All settings are in /config under filetree.

  • Claude activity: what shimmers: reads and writes (default), writes, reads or none. Git status, line counts and the git status at the bottom always show.
  • Follow Claude: on (default) scrolls the tree to what Claude reads, writes or commits; off keeps the view where you put it, and highlights still show.
  • Right column: date (default) or size; what the right column shows when a session starts. The Σ button in the header toggles it.
  • Glyphs: auto (default) uses Nerd Font icons when a Nerd Font is installed and your terminal started after it was installed, plain Unicode in the desktop app, and Nerd Font over SSH. nerd or plain forces one.

herdr

Clicking rows needs herdr 0.9.1 or later. herdr 0.9.0 and older accept pixel mouse reporting but still send cell positions, which would put every click in the session in the wrong place, so on those versions the rows ignore the mouse and the rest of the pane and session keep working. Run herdr update to get row clicks.

Contributing

Turn on the pre-commit hook once per clone; it runs claude plugin validate and the plugin tests before each commit that touches the plugin:

git config core.hooksPath .githooks

The same checks run on macOS, Windows and Linux in CI on every push that touches the plugin.

License

MIT

This project is inspired by my Omarchy app FileBlade

更多類似作品