【AsciiTree】フォルダ構成(ディレクトリ構成)を作成する

html/css
この記事は約2分で読めます。
スポンサーリンク

はじめに

フォルダ構成(ディレクトリ構成)をテキストで表現したい場合、自分で1から作成するとなると非常に面倒ですよね。

「罫線(けいせん)」で「├」や「└」を使って表現しなければいけません。

AsciiTreeを利用すれば簡単にフォルダ構成(ディレクトリ構成)を作成することができます。

対象者
  • フォルダ構成(ディレクトリ構成)をテキストで表現したい方
  • AsciiTreeを知らない方

それでは説明に移ります。

スポンサーリンク

AsciiTree

それでは紹介します。

AsciiTree

AsciiTree

使い方は非常に簡単で、以下のようにINPUTの入力フォームに階層構造をタブで表現させます。

html
	assets
		js
			main.js
			vendor.js
		css
			style.css
		img
			logo.png
	index.html

するとOUTPUT側に以下のようなフォルダ構成(ディレクトリ構成)が出力されます。

html
├ assets
│ ├ js
│ │ ├ main.js
│ │ └ vendor.js
│ ├ css
│ │ └ style.css
│ └ img
│   └ logo.png
└ index.html

「クリップボードにコピー」をクリックしてコピーすれば簡単にフォルダ構成(ディレクトリ構成)を表現できるようになります。

スポンサーリンク

おわりに

以上AsciiTreeを利用して簡単にフォルダ構成(ディレクトリ構成)を表現するやり方を紹介しました。

参考にしてください。

コメント

タイトルとURLをコピーしました