最近，我们的团队一直在使用 @atlaskit/util-readme 这个 npm 包，它是一个可以帮助生成组件文档的工具库。如果你想要快速、简单地生成组件的文档并且不想费太多功夫去撰写，@atlaskit/util-readme 就是一个不错的选择。在本文中，我们将介绍如何使用 @atlaskit/util-readme 这个工具。
安装
首先，我们需要将 @atlaskit/util-readme 安装到项目中。你可以通过在项目中运行以下命令来完成安装：
npm install @atlaskit/util-readme
使用示例
@atlaskit/util-readme 是一个针对 React 组件的 npm 包。你应该已经了解了 React，否则可以在 React 官方网站上学习。在这里，我们将使用一个假的组件进行演示。
组件文档
首先，让我们来创建一个组件文档。我们需要在组件文件所在的文件夹中创建一个名为 README.md 的文件，例如：
# 导航菜单组件 导航菜单组件用于创建 Web 应用程序导航菜单。 ## 安装 通过运行以下命令安装组件：
npm install @example/nav-menu
-- -------------------- ---- -------
-- --
-------------------- ----- ---------
------
------ - ------- - ---- --------------------
-------- ----- -
------ -
-----
-------- --
------
--
-API
Props
| 属性 | 类型 | 默认值 | 描述 |
|---|---|---|---|
items |
Array |
[] |
导航菜单项数组。 |
activeItemId |
String |
undefined |
当前活动的导航菜单项 ID。 |
方法
该组件暂无暴露方法。
示例
-- -------------------- ---- -------
------ - ------- - ---- --------------------
-------- ----- -
------ -
-----
--------
--------
- --- ------- ------ ---- --
- --- -------- ------ ------ --
--
-------------------
--
------
--
-作者
由 完全没技术背景 的小白 开发和维护。
-- -------------------- ---- -------
-------------------------------------------------------- -------- --------
--- ----
--------- --------------------- -------------------------- ------------------ --------------
-----
----- ---- - ----------------
-------------- - -
------ ----------------------- -----------------------
------- ----------------------- -------------
------------- -
-------------------- ----
------------- ----
------ ----
--
------------ ------------------------------
--这个配置文件告诉 @atlaskit/util-readme 从 src/NavigateMenu.js 文件中读取组件，然后将输出内容保存到根目录中的 README.md 文件中。
组件文件
现在，我们需要在 src 文件夹中创建一个名为 NavigateMenu.js 的组件文件。它应该如下所示：
-- -------------------- ---- -------
------ ----- ---- --------
------ --------- ---- -------------
------ -------- --------- ------ ------------ -- -
------ -
-----
----------------- -- -
--
-------------
--------------------
------------------ --- ------------ - -------- - ---
-
------------
----
---
------
--
-
----------------- - -
------ ------------------
-----------------
--- ----------------------------
------ ----------------------------
--
-------------
------------- -----------------
--生成文档
我们已经准备好了所有文件，现在我们可以生成文档了。你可以在项目中运行以下命令来生成文档：
npm run readme
文档将被生成到 README.md 文件中。因此，我们需要将文件提交到源代码库，以便其他人可以查看包文档。
总结
在这篇文章中，我们介绍了如何使用 @atlaskit/util-readme 生成组件文档。通过遵循本文中的步骤，你可以轻松地创建和维护你的组件文档。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5eedabbdb5cbfe1ea0610830