【VSC】ディレクトリ構造をテキストベースで一瞬で出力する方法
はじめに
開発中、AIにコードの書き方などを聞くことが増えてきたのだが、
トークンを消費していて別のAIに聞きたかったり、新規でトークを始める時に、
再度開発環境のディレクトリ構造を伝えたい。。
構成のスクショAIに送ることもできるが、
それだと有料版でないと回数に限りがあるし、
撮るのも。画像がたまるのも煩わしいので
テキストで構成を出力できたら便利なんだけどなあ〜
と思っていたので、調べてみたら思いの外簡単だったので共有したい。
まあそれも、DeepSeekに聞いたんだけど・・・
解決方法
まずはtreeコマンドをインストールする必要があるので
ターミナルでインストールしよう。
1. bash Homebrewでインストール（最速）
brew install tree
2. インストール後、以下のコードを実行
tree -L 3 --dirsfirst -I "node_modules|.git|pycache" | sed 's/│/├/g' | tee structure.md
たったこれだけの操作で、、、
.
├── public
├── src
├ ├── components
├ ├ ├── AnimeSection.tsx
├ ├ ├── Header.tsx
├ ├ ├── HeroSection.tsx
├ ├ ├── MovieCard.tsx
├ ├ ├── MovieSection.tsx
├ ├ └── MyListSection.tsx
├ ├── pages
├ ├ ├── AnimeDetail.tsx
├ ├ ├── App.tsx
├ ├ └── MovieDetail.tsx
├ ├── styles
├ ├ ├── App.css
├ ├ ├── index.css
├ ├ └── MovieDetail.css
├ ├── types
├ ├ └── media.d.ts
├ ├── main.tsx
├ └── vite-env.d.ts
├── eslint.config.js
├── index.html
├── package-lock.json
├── package.json
├── postcss.config.cjs
├── README.md
├── structure.md
├── tailwind.config.js
├── tsconfig.app.json
├── tsconfig.json
├── tsconfig.node.json
└── vite.config.ts
7 directories, 27 files
このように、
テキストベースのディレクトリ構造が
手に入ってしまった。
調べだして、たった2分での出来事だった。
簡単なのでぜひやってみてください。
ちなみにHomebrewが入っていない場合は、
まずHomebrewをインストール
/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
その後brew install tree
⚡ 代替方法（brewなしで即実行）
方法1：findコマンドで代用
bash
find . -maxdepth 3 -not -path '/node_modules' -not -path '/.git' -print | sed -e 's;[^/]*/;|;g;s;|; |;g' > structure.md
方法2：Pythonワンライナー
bash
python3 -c "import os; [print('|-- '+f) for r,d,fs in os.walk('.') for f in fs if '.git' not in r and 'node_modules' not in r][:50]" | tee structure.md
方法3：lsコマンドで簡易表示
bash
ls -R | grep ":
Discussion