npm 包 gitbook-plugin-anchor-navigation-ex-eus 使用教程

阅读时长 3 分钟读完

在前端开发中,经常会使用到 GitBook 来编写技术文档,而 gitbook-plugin-anchor-navigation-ex-eus 这个 npm 包则可以为 GitBook 添加锚点导航功能,在阅读文档时可以方便地跳转到指定位置。本文详细介绍 gitbook-plugin-anchor-navigation-ex-eus 的使用方法,以及如何在 GitBook 中启用和配置该插件。

1. 安装

首先需要在本地全局安装 GitBook:

接着,通过 npm 安装 gitbook-plugin-anchor-navigation-ex-eus:

其中 --save-dev 表示将该包作为项目的开发依赖安装,因为该插件只用于开发文档。

2. 配置

在 GitBook 项目目录下的 book.json 文件中添加插件配置:

-- -------------------- ---- -------
-
  ---------- -----------------------------
  ---------------- -
    --------------------------- -
      --------------- ------
      ----------- -----
      ------------ -----
      -------------- ----
    -
  -
-

以上配置参数的含义如下:

  • allowRepeats: 是否允许同一标题被重复锚点,默认为 false
  • contents: 导航列表标题,默认为 Table of Contents
  • hideIndex: 是否隐藏导航列表的索引(数字编号),默认为 true
  • scrollToTop: 是否启用回到顶部按钮,默认为 true

3. 使用

配置完毕后,启动 GitBook 预览即可看到添加了锚点导航的效果。

注意,插件默认只能为一级标题(h1)和二级标题(h2)生成锚点导航。如果需要为其他级别的标题生成锚点导航,可以使用以下语法:

其中 [1.2] 表示该标题的编号,该编号将用于在导航列表中显示该标题的顺序。在 allowRepeat 参数为 false 时,编号会自动根据已有的标题编号生成。

另外,如果想要在一段文字中添加跳转链接,可以使用以下语法:

其中 anchor-id 表示要跳转到的标题的 ID 属性值。该属性值应该与标题中的文本相同,以保证正确的跳转。如果需要为标题添加 ID 属性,可以在标题后面使用以下语法:

注意花括号 {} 的使用方式。

4. 示例代码

-- -------------------- ---- -------
- -- -

-------

-- -- -

---------

--- ----- -- -

---------

--- ----- -- -

----------

--------------------------

- ----

- ---- - ---------------------------------------------------------------------------------------------------------------
- -------- --------------------------------

- ------------------------------------------------------------------------------ --------
------------------------------------------------------------------------------------------------------------------------
纠错
反馈