ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

使用tree生成目录树结构

2021-12-15 10:06:16  阅读:165  来源: 互联网

标签:node md 树结构 -- modules tree js 目录


背景介绍

有时候,当你完成一个项目后,想要展示这个项目的目录结构(如下图所示),对该项目进行文档描述性说明,用于解释其项目中各个目录以及文件代表的含义,这样便于自己和后来的同学理解,在实际开发中,对于接收毫无文档说明的project,是非常痛苦的,一份好的readme文档也是非常重要的,那怎么办?逐行手写?当然不是,接下来,一步一步带你见证奇迹

基于tree-node-cli

类似树的格式列出目录的内容,类似于Linux树命令。提供了CLI和Node API 安装:

npm install -g tree-node-cli
或者
npm install --global tree-node-cli
复制代码

tree的命令使用帮助文档:当你在终端下输入tree --help时,终端下就会输出tree命令使用的一些参数

itclancode@LAPTOP-1CS413BU MINGW64 /d/公开课/2019/react/myfirstreactapp
$ tree --help
Usage: tree [options]

Options:
  -V, --version             output the version number
  -a, --all-files           All files, include hidden files, are printed.
  --dirs-first              List directories before files.
  -d, --dirs-only           List directories only.
  -I, --exclude [patterns]  Exclude files that match the pattern. | separates alternate patterns. Wrap your entire pattern in double quotes. E.g. `"node_modules|coverage".
  -L, --max-depth <n>       Max display depth of the directory tree.
  -r, --reverse             Sort the output in reverse alphabetic order.
  -F, --trailing-slash      Append a '/' for directories.
  -h, --help                output usage information
复制代码
  • tree -L n 显示项目的层级。n表示层级数。比如你想要显示项目的2层结构,可以用tree -l 2
  • tree -I pattern 用于过滤不想要显示的文件或者文件夹。比如你想要过滤项目中的node_modules文件夹,可以使用tree -I "node_modules",如果想要过滤多个目录文件,也可以tree -I "node_modules|public|test_*",最后一个使用到正则匹配,这样以test_开头的文件夹都不会被显示出来,目录与目录之间用竖线隔开,中间不要有空格
  • tree > tree.md 将项目结构输出到tree.md这个文件与在windows DOS的tree命令是一样的,但是在DOS终端下无法使用类似linux下的一些参数,进行过滤操作

如果我们要显示某个项目下2层的所有文件结构,同时又过滤node_modules文件夹,你可以这么写 tree -L 2 -I "要过滤的文件名",注意根据文档的参数,这是区分大小写的,而且要过滤的文件名必须得用双引号或者单引号包裹起来,在linux命令行里,参数的大小写含义是有别的,上面文档的参数是什么,就应该是什么的,这点与windows是不一样的,Windows下的dos命令是不区分大小写的

$ tree -L 2 -I "node_modules"
myfirstreactapp
├── DOS使用文档.txt.bak
├── package-lock.json
├── package.json
├── public
│   ├── favicon.ico
│   ├── index.html
│   └── manifest.json
├── README.md
└── src
    ├── App.css
    ├── App.js
    ├── App.test.js
    ├── components
    ├── index.css
    ├── index.js
    ├── logo.svg
    ├── serviceWorker.js
    └── view
复制代码

最后输出到tree.md,可以这么写

tree -L 3 -I "node_modules" > tree.md
复制代码

结果显示如下:

$ cat tree.md
myfirstreactapp
├── DOS使用文档.txt.bak
├── package-lock.json
├── package.json
├── public
│   ├── favicon.ico
│   ├── index.html
│   └── manifest.json
├── README.md
├── src
│   ├── App.css
│   ├── App.js
│   ├── App.test.js
│   ├── components
│   │   └── test.txt
│   ├── index.css
│   ├── index.js
│   ├── logo.svg
│   ├── serviceWorker.js
│   └── view
│       └── home.js
└── tree.md

复制代码

缺点:依赖node,得装tree-node-cli工具

参考资料

使用tree生成目录树结构

标签:node,md,树结构,--,modules,tree,js,目录
来源: https://blog.csdn.net/tianxintiandisheng/article/details/121945599

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有