VuePress生成器，以md文件生成文档说明

开发一个自己的组件库，那么如何提供说明文档呢？
大家当然可以动手开发一个，但是代价无疑有点大，那么有什么速成的方法吗？

当然有！！！，VuePress就可以很好的实现我们的诉求，让我们一起学习一下。

一、安装、构建VuePress

//1、新建文件夹vuepress-demo，并进入
mkdir vuepress-demo && cd vuepress-demo

// 2、包管理器进行初始化，根目录会会出现package.json文件
yarn init # npm init
//3、将 VuePress 安装为本地依赖
yarn add -D vuepress # npm install -D vuepress

//4、创建你的第一篇文档
mkdir docs && echo '# Hello VuePress' > docs/README.md

//5、在 package.json 中添加一些 scripts
{
  "scripts": {
    "dev": "vuepress dev docs",
    "build": "vuepress build docs"
  }
}
//6、在本地启动服务器
yarn dev # npm run dev

浏览器上访问地址就可以了，网站是自适应的(pc、m)

二、文件结构

VuePress 遵循 “约定优于配置” 的原则，推荐的目录结构如下

.
├── docs
│   ├── .vuepress (用于存放全局的配置、组件、静态资源等)
│   │   ├── components (目录中的 Vue 组件将会被自动注册为全局组件)
│   │   ├── theme (存放本地主题)
│   │   │   └── Layout.vue
│   │   ├── public (静态资源目录)
│   │   ├── styles (存放样式相关的文件)
│   │   │   ├── index.styl （将会被自动应用的全局样式文件）
│   │   │   └── palette.styl （用于重写默认颜色常量，或者设置新的 stylus 颜色常量）
│   │   ├── templates (存储 HTML 模板文件)
│   │   │   ├── dev.html （用于开发环境的 HTML 模板文件）
│   │   │   └── ssr.html （构建时基于 Vue SSR 的 HTML 模板文件）
│   │   ├── config.js (配置文件的入口文件，也可以是 YML 或 toml)
│   │   └── enhanceApp.js (客户端应用的增强)
│   │ 
│   ├── README.md
│   ├── guide
│   │   └── README.md
│   └── config.md
│ 
└── package.json