ディレクトリツリーをサクッと作る方法

何これ？

NERDTreeをCopilotにコピペして渡すと、ディレクトリツリーを作ってもらえる！

何の記事？

この記事は鎮宮'sアドベントカレンダー2025の17日目の記事です。

この記事では、ディレクトリツリーをパパッと作りたい人向けに、Copilotを使った方法と、CLIを使った方法の2種類の方法について書きました。

誰向け？ どんな役にたつ？

• ドキュメント内でディレクトリツリーを使いたいが、作り方がわからない人
• 今までディレクトリツリーを作成する際、頑張って手入力で作っていた人
• CLIが苦手なので、ディレクトリツリーをCLI以外で作る方法を知りたい人

あらすじ

Qiitaでもよく見かけるディレクトリツリー、かっこいいなと思いながら、自分もドキュメントに書きたいなというタイミングが来ました。
ただ、ディレクトリツリーについて、すごすごエンジニアの人たちは何か便利ツールを使って書いているのか?……と思い検索しても、特にそういった記事は見つけられず。
「ファイル ツリー図」とか「書き方」「使う記号」……などで探していたのが微妙だったのかもしれません。

「そうか、プロのエンジニアになってくると、きっとディレクトリツリーなんて息をするレベルで書けるようになるんだな……」 と納得し、エンジニアレベルがまだまだ高くない私はCopilot君に「このインデントからディレクトリツリー作れる?」……と投げてみることにしました。
するとまぁ、綺麗にディレクトリツリー作ってくれるじゃないですか!! すごい!!
ルールが決まってて処理しやすい指示の部類だったんだとしても、欲しいやつが一発で出てきた!! すごい!!! 多分初めて生成AIに感動しました。便利だと思って使ってはいたけど、「おおお！」となった。
しかも「マークダウンなら絵文字アイコンをつけたり、文字色や背景色も変えましょうか?」と聞いてくれる。嬉しくなって「aとbの文字色を変えてほしい」と指示したらちゃんとそのファイルだけ色変更してくれました。賢いー!!!

……ただ、よくよく見るとフォルダ名から綺麗に線画伸びてなかったりなど、ズレも気になる……。
そんな折、「ディレクトリツリー　ずれない方法」……とかググってたら何やらtreeというコマンドがあることを知りました。君に最初に出会いたかったよ!!!

……そんなわけで、あらすじが長くなりましたがCopilotとtreeコマンドでのディレクトリツリーの作り方について書いていきたいと思います。

Copilotで作る場合

Copilotでディレクトリツリーを作るメリット

Copilotを使うといいところ

• CLIを介さなくていい(Copilotにチャットで頼める)
• 絵文字を含めて生成したり、HTMLタグなどで文字色や背景色を変更してくれる
• PC上に実在していないディレクトリツリーも、インデント構造で書けば作ってもらえる
• 参考サイトなどもここに載せる
• 見出し4くらいの大きさで、目次に載るようにする

Copilot生成だと難しいところ

• タグを使って装飾を行う場合、タグを読み込んでプレビューしてくれるエディタで読まない場合、ほぼ読めない
• 装飾を加えるとフォルダ名から線が伸びていなかったりなど、ズレが目立つ

Copilotを使うと何がいいかというと、treeコマンドなんて知らなくても、インデント構造のテキストを投げればあとはCopilotがやってくれるところです。
こんな感じのディレクトリツリー図を作りたい!->いいよ!……と言ってもらえるのがいいところ。
また、ズレさえ許容するか手修正できる範囲であれば、いくらでも見栄えを盛れるので、変更予定のない資料に使ったり、画像化して使う場合などにも向くかなと思います。

Copilotでの作り方

1. インデント構造のテキストを用意する

project
    src
        main.py
        utils.py
    docs
        README.md
    tests
        test_main.py

こんな感じで、ディレクトリツリーの線さえ書けば完成！……となるファイル名やフォルダ名を並べてインデント構造にしたテキストを用意します。
冒頭のNERDTreeのコピペでも大丈夫です。
インデント構造になっていれば、タブでもスペースでも読み取ってくれます。

2. Copilotにテキストを渡す

Copilotには下記のように投げたら作ってもらえました。

下記文章をもとに、ディレクトリツリー図を作ってください。

project
    src
        main.py
        utils.py
    docs
        README.md
    tests
        test_main.py

3. 生成結果に対して、装飾の希望があれば追加でオーダーする

デフォルトで生成してくれるのは大体下記。

CLI風.txt

project
├── src
│   ├── main.py
│   └── utils.py
├── docs
│   └── README.md
└── tests
    └── test_main.py

Markdown形式のツリー.

- project
    - src
        - main.py
        - utils.py
    - docs
        - README.md
    - tests
        - test_main.py

マーメイド記法も書いてくれるし、プレビュー画像だけもらったり、コード出力もできる.

graph TD
    A[project] --> B[src]
    B --> C[main.py]
    B --> D[utils.py]
    A --> E[docs]
    E --> F[README.md]
    A --> G[tests]
    G --> H[test_main.py]

絵文字アイコンを付けたい！……というと、下記のように装飾したものを出してくれる。

📁 project
├── 📁 src
│   ├── 🐍 main.py
│   └── 🐍 utils.py
├── 📁 docs
│   └── 📝 README.md
├── 📁 tests
│   └── 🐍 test_main.py
└── 📁 assets
    └── 🖼️ logo.png

マークダウンテキストで使うけど、Pythonファイルだけ色を付けたいと指示すると下記を出してくれる。

📁 project  
├── 📁 src  
│   ├── <span style="background-color: #ffea70">🐍 main.py</span>  
│   └── <span style="background-color: #ffea70">🐍 utils.py</span>  
├── 📁 docs  
│   └── 📝 README.md  
├── 📁 tests  
│   └── <span style="background-color: #ffea70">🐍 test_main.py</span>  
└── 📁 assets  

CLIで作る場合

treeコマンドとは

CLIで今自分がいるディレクトリから下層に下るようにディレクトリ構造を書き出してくれるコマンドです。
そのため、とりあえずCLI開いて試し撃ちすると、出力が止まらなくて大変なことになります。(やった。Ctrl+Cで止めた)
使い方としては下記の通り。シンプルです。

# ファイルも含めて階層構造を出力する
tree /f 

# ASCII文字で出力する
tree /a

# ファイルも含めたASCII文字で出力した結果をtree.txtに書き出す
tree /f /a > tree.txt

ちなみに、treeコマンドでディレクトリツリーを作るためにはCLI上でその構造の場所まで行かないといけないのが難点なのですが、これについてはエクスプローラーで希望の場所まで行ってから、アドレスバーにcmdと入力することで、その場所でコマンドプロンプトを開くことができます。
なので、cdなどでのCLIでの移動が難しい人は、エクスプローラーで移動したあとにコマンドプロンプトを開く……を使うと楽ちんです。

treeコマンドのメリット

treeコマンドのいいところ

• テキストベースで変更があってもメンテナンスがしやすい
• 他の人も同じものを再現しやすい
• 表示エディタを選ばない
• Vim等、編集/加工に強いエディタ使いだと編集しやすい
• フォルダ横にコメントを加える場合など、複雑な成形も難しくない(Vimmerなら)

treeコマンドの難しいところ

• CLIを使う
• cacheファイルなど説明不要なファイルも入ってくるため、編集の必要がある
• 色や絵文字をつけたりなどの装飾はできない(出力後に自分で編集するのは可能)

出力後の加工について

treeコマンドで一瞬でディレクトリ構造が書き出されるのですが、意外と説明にいらないファイルも混ざっていたりして、自分で編集する必要が出てきました。(cacheファイルとか)
この辺りは、指示しないファイルは書き出さず、言えばパッと修正してくれるCopilotの方が楽ちんかもしれません。

結局どっちの方法で作るのが楽か

人によるし、場合によるかな、と感じました。
シンプルで取り回しが効きやすいものを求めるならtreeコマンドでの生成かなと思いますし、見栄えのいい資料を作りたかったり、Copilotという1アプリ内で完結させたい場合はCopilotに全部伝えて作ってもらうのがいいと思います。

応用事例

Vimmer目線での活用方法になってしまいますが、やっぱりVimっていいな……と思ったので残しておきます。

NERDTreeをコピーしてCopilotになげると楽

冒頭画像のように、NERDTreeのディレクトリ画面をコピーして、Copilotに投げると楽です。treeコマンドを使うまでもなく、簡単な図であればサッと作ってくれるので、NERDTreeすごい!……となりました。

Vimだと出力後の加工が楽

指定パターンと編集機能の強いエディタってすごいんだな……と思いました。

例えば、上記画像のutils.pyが不要だとします。そんな時Vimなら

行を削除して、

docsとsrcがくっつかないようにするために、この場所をヤンク。

main.pyのトコにペースト。……などなど、後から編集するのがめちゃくちゃ楽でした。
Copilot君が微妙な絵文字しか出してくれなかった時にも、Vimでファイル頭に絵文字挿入するのも楽にできます。