在写项目 README.md 说明文档时,如果有一个 markdown 目录结构图就很 nice 了
前人栽树后人乘凉,无独有偶,npm 上已经有这样的一个包:mddir ,我们可以使用它来为项目生成目录结构图
使用如下:
# 1、项目中安装 mddir(如果要全局安装,需要将 mddir 配置环境变量)
$ yarn add mddir -D
# or npm install mddir -D
# 2、执行命令,生成结构图
# 具体要生成哪个目录的结构图,看自己需求
# node node_modules/mddir/src/mddir [you folder](可选,默认当前目录)
$ node node_modules/mddir/src/mddir
执行命令后会在当前目录下生成一个 directoryList.md 的 md 文件
内容如下:
|-- Html5
|-- .babelrc
|-- .gitignore
|-- README.md
|-- directoryList.md
|-- gulpfile.js
|-- package.json
|-- yarn.lock
|-- config
| |-- env.js
| |-- paths.js
| |-- polyfills.js
| |-- webpack.config.dev.js
| |-- webpack.config.prod.js
| |-- jest
| |-- cssTransform.js
| |-- fileTransform.js
|-- public
| |-- favicon.ico
| |-- index.html
|-- scripts
| |-- build.js
| |-- start.js
| |-- test.js
|-- src
|-- App.css
|-- App.js
|-- App.test.js
|-- index.css
|-- index.js
|-- logo.svg
|-- api
| |-- index.js
|-- components
| |-- hello.jsx
| |-- hoc.jsx
| |-- stoneForm.jsx
| |-- template.jsx
|-- router
| |-- routes.jsx
|-- store
| |-- index.jsx
|-- utils
| |-- cookie.js
| |-- module.js
|-- views
|-- home
| |-- Home.jsx
| |-- home.css
|-- login
| |-- Login.jsx
|-- template
|-- common.jsx
更多详细说明请看官方文档介绍:mddir