介绍
heyui-doc 是一款基于 Vue.js 和 HeyUI UI组件库，快速搭建文档中心的 npm 包。它可以在文档编写时快速生成目录和侧边栏，并提供丰富的配置选项。使用 heyui-doc 可以大大提高文档编写效率，让我们更专注于文档的内容和质量。
安装
安装 heyui-doc 最简单的方式是通过 npm 进行安装。在命令行中输入以下命令即可：
npm install heyui-doc
配置
heyui-doc 通过在 Markdown 文件中添加特定的语法来实现生成目录和侧边栏的功能。下面是一个包含目录和侧边栏的 Hello World 示例：
-- -------------------- ---- ------- - ----- ----- -- -- - ------------------- - -------------------- -- ----- --------------------------- ------- -- ----- ---------------------------- ------------
通过上面的示例可以看出，目录和侧边栏的语法非常简单明了，只需要在 Markdown 文件中使用 ## 目录 语法来定义目录，然后使用 - 和 [文本](#id) 的语法来定义目录条目。而为了实现目录和侧边栏的关联，需要在相应的标题后面加上一个 id，例如 <span id="introduction">。
同时，heyui-doc 还提供了一些额外的配置，可以通过在 config 对象中设置来修改。下面是一个包含所有可配置参数及其默认值的示例：
-- -------------------- ---- -------
--- -------- - ---------------------
--------------- - -
------ -------
------------ ------------
----------- ----------
-------- -
--------------- -
-
------ -------
------------ ------
--------- -
----------
--------------
---------
-----------
-
-
-
-
--在上面的示例中，我们可以看到 heyui-doc 的主题、文档标题和描述都可以通过 config 对象来设置。而最重要的当然是 sidebar，它定义了目录和侧边栏的内容和结构，我们可以看到它是一个对象，其中 /user-guide/ 是我们希望配置的目录所在的相对路径，然后我们在这个路径下添加了一个名为“用户指南”的目录条目，这个条目有四个子条目，它们的文本内容分别为 "install"，"quick-start"，"config" 和 "markdown"。
使用
在配置好 heyui-doc 后，我们就可以使用它来生成我们的文档了。我们只需要执行下面的命令来启动 heyui-doc：
heyui-doc
这会在我们当前的目录下启动一个本地服务器，并将我们的文档呈现在浏览器中。此外，我们还可以通过设置端口号和监听的文件来修改 heyui-doc 的行为，例如：
heyui-doc -p 8080 -w "./docs/"
上面的命令将把 heyui-doc 监听在 8080 端口并监听当前目录下的 docs 目录中的文件。
总结
heyui-doc 是一个十分有用的 npm 包，它为我们提供了快速搭建文档中心的功能。通过本文的教程，我们学习了 heyui-doc 的安装、配置和使用方法，并为我们的文档编写带来了极大的方便。当然，heyui-doc 的功能远不止于此，希望大家可以深入探索 heyui-doc ，并掌握更多更高级的用法。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60055b8081e8991b448d90fe