Background introduction
Sometimes, when you finish a project, you want to show the directory structure of the project (as shown in the figure below) and give a document descriptive description of the project to explain the meaning of various directories and file representatives in the project, which is convenient for yourself and later students to understand. In actual development, it is very painful to receive projects without documentation, A good readme document is also very important. What should I do? Line by line? Of course not. Next, take you to witness miracles step by step
Based on tree node cli
A tree like format lists the contents of the directory, similar to the Linux tree command. Provides CLI and Node API installation:
npm install -g tree-node-cli perhaps npm install --global tree-node-cli Copy code
The tree command uses help documents: when you enter tree --help under the terminal, some parameters used by the tree command will be output under the terminal
itclancode@LAPTOP-1CS413BU MINGW64 /d/Open class/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 Copy code
- tree -L n displays the hierarchy of the item. N represents the number of layers. For example, if you want to display the 2-tier structure of the project, you can use tree -l 2
- tree -I pattern is used to filter files or folders that you do not want to display. For example, you want to filter nodes in the project_ In the modules folder, you can use tree -I "node_modules". If you want to filter multiple directory files, you can also use tree -I "node_modules|public|test_ *". The last one uses regular matching, so as to test_ The folders at the beginning will not be displayed. The directories are separated by vertical lines without spaces in the middle
- tree > tree.md outputs the project structure to tree The MD file is the same as the tree command in windows DOS, but some parameters similar to those in linux cannot be used for filtering in DOS terminal
If we want to display all the file structures of the lower 2 layers of a project and filter the node at the same time_ In the modules folder, you can write tree -L 2 -I "file name to be filtered". Note that it is case sensitive according to the parameters of the document, and the file name to be filtered must be wrapped in double quotation marks or single quotation marks. In the linux command line, the case meaning of parameters is different. The parameters in the above document should be what they are. This is different from Windows, dos commands under Windows are case insensitive
$ tree -L 2 -I "node_modules"
myfirstreactapp
├── DOS Working with documents.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
Copy code
Finally output to tree MD, you can write that
tree -L 3 -I "node_modules" > tree.md Copy code
The results are as follows:
$ cat tree.md myfirstreactapp ├── DOS Working with documents.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 Copy code
Disadvantages: depending on node, you have to install the tree node cli tool