前言
esdoc-inject-style-plugin 是一个 npm 包，用于在 esdoc 构建的文档中注入自定义样式，可以很好地定制文档样式，提升文档的可读性和美观度。
本文将详细介绍 esdoc-inject-style-plugin 的安装、配置和使用，同时提供示例代码，帮助读者快速上手。
安装
使用 npm 安装 esdoc-inject-style-plugin：
$ npm install esdoc-inject-style-plugin
配置
在 esdoc 的配置文件中（一般为 .esdoc.json），添加如下配置：
-- -------------------- ---- -------
-
---------- -
-
------- ----------------------------
--------- -
-------- --------------------
-
-
-
-其中，name 为插件名称，option 中的 style 为自定义样式文件的路径，可以是相对路径或绝对路径。在构建文档时，esdoc-inject-style-plugin 会将自定义样式文件注入到 esdoc 生成的文档中。
使用
使用 esdoc-inject-style-plugin 很简单，只需要在需要注入样式的地方添加样式即可。以下是一个示例：
-- -------------------- ---- ------- --- - ---- - ------ -------- - --- - ------ -------- - -- - -------- -------- - -- -------- ------ -- - ------ - - -- -
在注释中添加了 "@param" 和 "@returns" 标签，文档中展示的效果如下：
接下来，我们使用 esdoc-inject-style-plugin 为文档添加自定义样式。
首先，创建一个 custom.css 文件，添加如下样式：
-- -------------------- ---- ------- --------------------------------- --------------------------- - ----------------- -------- ------- --- ----- ----- -------- ---- -------------- ----- - --------------------------------- --------------------------- - ------------ ----- ----------- ----- - --------------------------------- --------------------------------- - ----------------- -------- ------- --- ----- ----- -------- ---- -------------- ----- -
其中，".esdoc-argument-description" 为 "@param" 标签的样式，".esdoc-method-returns-description" 为 "@returns" 标签的样式，".esdoc-method-returns-title" 为 "@returns" 标签的标题样式。具体的样式代码可以根据需求进行自定义。
将 custom.css 添加到 esdoc 的配置文件中：
-- -------------------- ---- -------
-
---------- -
-
------- ----------------------------
--------- -
-------- --------------------
-
-
-
-重新构建文档，效果如下：
可以看到，样式已经被成功注入到文档中了。这样，我们就可以根据需求，自由地定制文档的样式了。
总结
本文介绍了 npm 包 esdoc-inject-style-plugin 的安装、配置和使用方法。使用 esdoc-inject-style-plugin 可以方便地定制 esdoc 构建的文档样式，提升文档的可读性和美观度。
同时，本文提供了详细的示例代码，希望能够帮助读者更好地理解和掌握该工具的使用方法。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005588d81e8991b448d5d0c