阅读 364

使用 mddir 生成目录结构图(工程结构图)

在写项目 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

关注下面的标签,发现更多相似文章
评论