Mac 生成项目目录树形结构

经常看到别人在博客，教程上输出优美的目录结构，是不是自己也很想来一个～

开始

# 安装 tree
brew install tree

# 安装后在文件夹内执行
tree

常用命令

一定要注意大小写！

• tree --help 查看更多命令
• tree -d 只显示文件夹
• tree -L n 要显示项目的层级。n为层级数
  • 比如我要显示每个目录往下两级 tree -L 2
• tree -I pattern 过滤不想显示的文件或者文件夹。
  • 比如我要过滤node依赖还有src文件夹 tree -I 'node_modules|src'
• tree > tree.txt 将项目结构输出到 tree.txt 这个文件

全部命令

• -a 显示所有文件和目录。
• -A 使用ASNI绘图字符显示树状图而非以ASCII字符组合。
• -C 在文件和目录清单加上色彩，便于区分各种类型。
• -d 显示目录名称而非内容。
• -D 列出文件或目录的更改时间。
• -f 在每个文件或目录之前，显示完整的相对路径名称。
• -F 在执行文件，目录，Socket，符号连接，管道名称名称，各自加上"*","/","=","@","|"号。
• -g 列出文件或目录的所属群组名称，没有对应的名称时，则显示群组识别码。
• -i 不以阶梯状列出文件或目录名称。
• -I<范本样式> 不显示符合范本样式的文件或目录名称。
• -l 如遇到性质为符号连接的目录，直接列出该连接所指向的原始目录。
• -n 不在文件和目录清单加上色彩。
• -N 直接列出文件和目录名称，包括控制字符。
• -p 列出权限标示。
• -P<范本样式> 只显示符合范本样式的文件或目录名称。
• -q 用"?"号取代控制字符，列出文件和目录名称。
• -s 列出文件或目录大小。
• -t 用文件和目录的更改时间排序。
• -u 列出文件或目录的拥有者名称，没有对应的名称时，则显示用户识别码。
• -x 将范围局限在现行的文件系统中，若指定目录下的某些子目录，其存放于另一个文件系统上，则将该子目录予以排除在寻找范围外。

---

看看输出效果：

.
├── build
│   ├── config.js
│   ├── webpack.common.js
│   ├── webpack.dev.js
│   └── webpack.prod.js
├── dist
│   ├── css
│   │   ├── app.css
│   │   ├── app.css.map
│   │   ├── bread.css
│   │   ├── bread.css.map
│   │   ├── companies_page.css
│   │   ├── companies_page.css.map
│   │   ├── style.css
│   │   └── style.css.map
│   ├── fonts
│   │   ├── glyphicons-halflings-regular.eot
│   │   ├── glyphicons-halflings-regular.ttf
│   │   ├── glyphicons-halflings-regular.woff
│   │   └── glyphicons-halflings-regular.woff2
│   ├── images
│   │   ├── BlackHole-9c5a04.jpg
│   │   └── glyphicons-halflings-regular-898896.svg
│   ├── index.html
│   └── js
│       ├── app.js
│       ├── chunk.15854.js
│       ├── chunk.40874.js
│       ├── chunk.d7ffe.js
│       └── page.js
├── package-lock.json
├── package.json
├── server.js
└── yarn.lock

完美～
带上个文档吧～菜鸟教程文档