mddir是个能帮助我们快速生成markdown语法形式的文件目录结构的工具,详细说明请参考官方文档
(一) 安装mddir工具
要安装mddir工具,必须先安装npm包管理工具。我的npm包管理工具是在安装node时自动安装的
npm install mddir -g
(二) 使用mddir工具
利用命令行进入对应文件夹,然后输入并执行mddir命令。
mddir
最终在对应文件夹内会生成一个directoryList.md文件:
第一行出现的’undefined’用父文件夹名,输入代替即可。
注意,上图内容还是纯文本内容,markdown解析器解析渲染之后并不会正确显示,
而是需要像markdown中的代码块一样用两个三重反引号(```)包围起来,最终结果如下所示:
|-- 对应文件夹
|-- .browserslistrc
|-- .editorconfig
|-- .env.cloudDev
|-- .env.cloudMine
|-- .env.cloudPro
|-- .env.cloudTest
|-- .env.private.development
|-- .env.private.production
|-- .env.private.test
|-- .env.public.development
|-- .env.public.production
|-- .env.public.test
|-- .eslintrc.js
|-- .gitignore
|-- .npmignore
|-- .npmrc
|-- .prettierrc.js
|-- babel.config.js
|-- package-lock.json
|-- package.json
|-- plopfile.js
|-- postcss.config.js
|-- README.md
|-- vue.config.js
|-- .idea
| |-- $PRODUCT_WORKSPACE_FILE$
| |-- misc.xml
| |-- modules.xml
| |-- scaffold-ui.iml
| |-- vcs.xml
| |-- workspace.xml
| |-- inspectionProfiles
| |-- Project_Default.xml
|-- docs
| |-- css-module.md
| |-- scaffold.md
|-- plop-templates
| |-- view
| |-- dialog.hbs
| |-- index.hbs
| |-- service.hbs
| |-- validations.hbs
|-- public
| |-- favicon.ico
| |-- index.html
|-- src
|-- App.vue
|-- main.js
|-- permission.js
|-- assets
| |-- logo.png
| |-- 404_images
| | |-- 404.png
| | |-- 404_cloud.png
| |-- svg
| | |-- icon-wring.svg
| | |-- logo.svg
| | |-- nav-home.svg
| | |-- nav-point.svg
| | |-- nav-theme.svg
| | |-- nav-usage.svg
| | |-- park.svg
| |-- usage
| |-- carbon-css-module.png
| |-- carbon-scaffold.png
|-- components
| |-- SvgIcon.vue
| |-- app
| | |-- AppBreadcrumb.vue
| | |-- AppDialog.vue
| | |-- AppFooter.vue
| | |-- AppHeader.vue
| | |-- AppAside
| | |-- index.vue
| | |-- Link.vue
| | |-- SidebarItem.vue
| |-- dialog
| | |-- plop.vue
| |-- layout
| | |-- AppLayout.vue
| | |-- ContainerLayout.vue
| |-- table
| |-- TableDelete.vue
| |-- TableFooter.vue
| |-- TableHeader.vue
|-- plugins
| |-- common-register
| | |-- index.js
| |-- css-module
| | |-- class-context.js
| | |-- class-props.js
| | |-- index.js
| | |-- utils.js
| |-- isyscore-ui
| | |-- index.js
| |-- vue-life
| |-- index.js
|-- router
| |-- index.js
| |-- routerRoles.js
| |-- routes.js
|-- services
| |-- plop.js
| |-- todo.js
| |-- user.js
|-- store
| |-- getters.js
| |-- index.js
| |-- mutations.js
| |-- state.js
| |-- types.js
|-- styles
| |-- color.css
| |-- color.scss
| |-- flex.css
| |-- flex.scss
| |-- offset.css
| |-- offset.scss
| |-- reset.css
| |-- reset.scss
| |-- text.css
| |-- text.scss
| |-- _variables.scss
|-- utils
| |-- baseValidate.js
| |-- loading.js
| |-- message.js
| |-- number.js
| |-- object.js
| |-- querystring.js
| |-- service.js
| |-- throttle.js
| |-- typeis.js
| |-- validators.js
|-- validations
| |-- plop.js
|-- views
|-- 404.vue
|-- Home.vue
|-- Login.vue
|-- plop.vue