生成项目结构图 - Tree命令的使用

Tree命令

.
├── ./app                       # webapck 编译打包压缩生成的文件
├── ./build                 # electron-builder生成安装包配置目录
│   ├── ./build/background.png   # (macOS DMG background)
│   ├── ./build/icon.icns        # (macOS app icon)
│   └── ./build/icon.ico         # (Windows app icon)
├── ./dev-server.js
├── ./json                  # 部分Api接口数据
├── ./main.js                   # electron 初始化文件
├── ./package.json
├── ./preview                   # 项目运行预览图
├── ./src
│   ├── ./src/assets        # 静态资源文件
│   ├── ./src/components    # 项目组件文件
│   ├── ./src/js                # 主模块文件
│   ├── ./src/main.js       # render 进程入口文件
│   └── ./src/sass          # 样式文件
└── ./webpack.config.js     # webpack 配置文件

你一定见过这样的项目结构图吧，其实他也不是图，是一段代码；

windows

windows下的tree比较辣鸡，只有两个参数，/F是递归显示每个文件夹的名称；/A 是使用ASCII字符而不是扩展字符，感觉还不如不加/A 参数好。

linux

linux下的tree就比较强大了，但一般系统并不自带这个命令，需要手动下载安装：sudo apt-get install tree 。文件很小，只有31K，但功能可强大了！

mac

Mac 的话是没有自带tree命令的，但是我们可以通过homebrew（如果你不知道它的话，这是官网）安装：

brew install tree

然后等待安装完成后

tree --version  # 查看是否安装成功
tree --help     # 查看帮助

Api

命令有很多，但是看常用的无非就是：
-f 生成关系图
-I 忽略文件/文件夹
-d 只输出目录

usage: tree [-acdfghilnpqrstuvxACDFJQNSUX] [-H baseHREF] [-T title ]
    [-L level [-R]] [-P pattern] [-I pattern] [-o filename] [--version]
    [--help] [--inodes] [--device] [--noreport] [--nolinks] [--dirsfirst]
    [--charset charset] [--filelimit[=]#] [--si] [--timefmt[=]<f>]
    [--sort[=]<name>] [--matchdirs] [--ignore-case] [--] [<directory list>]
  ------- Listing options -------
  -a            All files are listed.
  -d            List directories only.
  -l            Follow symbolic links like directories.
  -f            Print the full path prefix for each file.
  -x            Stay on current filesystem only.
  -L level      Descend only level directories deep.
  -R            Rerun tree when max dir level reached.
  -P pattern    List only those files that match the pattern given.
  -I pattern    Do not list files that match the given pattern.
  --ignore-case Ignore case when pattern matching.
  --matchdirs   Include directory names in -P pattern matching.
  --noreport    Turn off file/directory count at end of tree listing.
  --charset X   Use charset X for terminal/HTML and indentation line output.
  --filelimit # Do not descend dirs with more than # files in them.
  --timefmt <f> Print and format time according to the format <f>.
  -o filename   Output to file instead of stdout.
  -------- File options ---------
  -q            Print non-printable characters as '?'.
  -N            Print non-printable characters as is.
  -Q            Quote filenames with double quotes.
  -p            Print the protections for each file.
  -u            Displays file owner or UID number.
  -g            Displays file group owner or GID number.
  -s            Print the size in bytes of each file.
  -h            Print the size in a more human readable way.
  --si          Like -h, but use in SI units (powers of 1000).
  -D            Print the date of last modification or (-c) status change.
  -F            Appends '/', '=', '*', '@', '|' or '>' as per ls -F.
  --inodes      Print inode number of each file.
  --device      Print device ID number to which each file belongs.
  ------- Sorting options -------
  -v            Sort files alphanumerically by version.
  -t            Sort files by last modification time.
  -c            Sort files by last status change time.
  -U            Leave files unsorted.
  -r            Reverse the order of the sort.
  --dirsfirst   List directories before files (-U disables).
  --sort X      Select sort: name,version,size,mtime,ctime.
  ------- Graphics options ------
  -i            Don't print indentation lines.
  -A            Print ANSI lines graphic indentation lines.
  -S            Print with CP437 (console) graphics indentation lines.
  -n            Turn colorization off always (-C overrides).
  -C            Turn colorization on always.
  ------- XML/HTML/JSON options -------
  -X            Prints out an XML representation of the tree.
  -J            Prints out an JSON representation of the tree.
  -H baseHREF   Prints out HTML format with baseHREF as top directory.
  -T string     Replace the default HTML title and H1 header with string.
  --nolinks     Turn off hyperlinks in HTML output.
  ---- Miscellaneous options ----
  --version     Print version and exit.
  --help        Print usage and this help message and exit.
  --            Options processing terminator.

中文Api

如果你觉得上面的看起来很麻烦，那就看这里 😉

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

Used

下面是我生成上面的结构所用的命令，大家可以参考下

tree -I 'node_modules|dist|*.mp3|*.jpg' -f 项目文件夹

原文地址：https://wodewone.github.io/2017/02/19/node-tree-user/