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

在前端开发中,经常会使用到 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. 示例代码

- -- -

-------

-- -- -

---------

--- ----- -- -

---------

--- ----- -- -

----------

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

- ----

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

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

猜你喜欢

  • npm包@fuzeman/eslint-import-resolver-babel-module使用教程

    在前端开发中,使用ESLint可以帮助我们发现代码中的潜在问题,保证代码质量。而@fuzeman/eslint-import-resolver-babel-module这个npm包则是用来解决使用we...

    3 年前
  • npm包 mrjs 使用教程

    前言 现如今,前端领域技术正在不断发展,各种工具和框架层出不穷。其中,npm 可以说是不可或缺的一部分,因为很多工具和框架都建立在 npm 包的基础上。而 mrjs 则是 npm 生态系统中的一个非常...

    3 年前
  • NPM 包 @tessdata/mya 使用教程

    简介 @tessdata/mya 是一个用于提供新款缅甸语字体 Tesseract OCR 训练脚本的 npm 包。Tesseract OCR 是一个开放源代码的 OCR 引擎,能够将图像转换为可编辑...

    3 年前
  • npm 包 @tessdata/osd 使用教程

    介绍 @tessdata/osd 是一个 npm 包,用于文字检测和识别。它基于开源 OCR 引擎 Tesseract,并提供了预训练的模型,可用于检测和识别多种文字语言。

    3 年前
  • npm 包 @tessdata/ori 使用教程

    简介 在前端开发中,我们经常需要使用 OCR(Optical Character Recognition)技术对图像中的文字进行识别。而 @tessdata/ori 就是一个 OCR 模型库,可以用于...

    3 年前
  • npm 包 @tessdata/pan 使用教程

    简介 @tessdata/pan 是一个基于 Tesseract OCR 引擎的中文图像文本识别库。该库针对中文语言进行了优化,支持多种文字格式的识别,包括仿宋、楷体等。

    3 年前
  • npm 包 @tessdata/pol 使用教程

    在前端开发中,我们经常需要识别图像中的文字。而 @tessdata/pol 正是一个可用于 OCR(Optical Character Recognition)的开源工具包。

    3 年前
  • npm包assemble-hekyll的使用教程

    简介 assemble-hekyll是一个npm包,它使用了Assemble插件和Handlebars模板引擎,可以方便地将Markdown文档转换为Jekyll网站的页面。

    3 年前
  • npm 包 redux-plugin 使用教程

    在前端应用中,状态管理是至关重要的一环。Redux 可以帮助前端开发者在应用中管理和更新组件共享的数据,有助于提高应用的可靠性和可维护性。而 redux-plugin,是一款方便实用的 Redux 插...

    3 年前
  • npm 包 @tessdata/por 使用教程

    什么是 @tessdata/por @tessdata/por 是一个 npm 包,用于识别多语言文本中的文字。它基于 Tesseract OCR 引擎,支持识别多种语言的文字,并将结果以文本形式返回...

    3 年前
  • npm 包 @tessdata/pus 使用教程

    前言 @tessdata/pus 是一个基于 Tesseract-OCR 的中英文识别模型,可以帮助项目实现文字的自动识别和分析。在前端开发中,这个包可以让我们轻松地集成字识别的功能,提高应用的可用性...

    3 年前
  • npm 包 @tessdata/ron 使用教程

    随着计算机视觉技术的不断发展,OCR 技术也越来越成熟。@tessdata/ron 是一个用于 OCR 技术的 npm 包,它可以将图片中的文字识别出来。 安装 在使用 @tessdata/ron 之...

    3 年前
  • npm 包 @tessdata/san 使用教程

    前言 在进行前端图像识别等相关项目时,常常需要使用到 OCR 技术,也就是 Optical Character Recognition(光学字符识别)技术。而 Tesseract-OCR 是一个开源的...

    3 年前
  • npm 包 fast-delete 使用教程

    在前端开发中,快速、高效地删除数组元素是一种常见需求。npm 包 fast-delete 就是一个优秀的解决方案,它可以让我们快速删除数组元素,从而提高代码的执行效率。

    3 年前
  • npm 包 finish-framework 使用教程

    前言 随着前端技术的发展,我们需要处理越来越多的数据和业务逻辑,而且能够高效地开发和维护代码,成为了前端工作的重要一环。在这个过程中,使用好工具,就是效率的保障。finish-framework 就是...

    3 年前
  • npm 包 handbrake-bin-fork 使用教程

    简介 handbrake-bin-fork 是一个 Node.js 包装器,提供了一个命令行接口和 JavaScript API 使你可以使用 Handbrake(视频转码库)。

    3 年前
  • npm 包 nge-cli 使用教程

    前言 随着前端技术的不断发展,越来越多的开发者开始使用各种辅助工具来提高效率和质量。其中, npm 成为了最受欢迎的包管理工具之一。而 nge-cli 则是一款基于 npm 的前端脚手架,可以帮助我们...

    3 年前
  • npm 包 @parente/jupyterlab_xkcd 使用教程

    简介 @parente/jupyterlab_xkcd 是一个 JupyterLab 插件,可以在 JupyterLab 中添加一个 xkcd 风格的漫画小部件。使用该插件可以让 JupyterLab...

    3 年前
  • npm 包 de-table 使用教程

    前言 开发一个前端网站往往涉及到很多表格展示的需求,而 de-table 是一个基于 Vue 的表格组件,其具有易用性、高定制性、高性能的特点,能够满足前端开发者的需求。

    3 年前
  • npm 包 dbc-bdd 使用教程

    在前端开发过程中,我们经常需要使用各种第三方库来辅助我们完成一些任务。而 npm 是一个非常流行的 JavaScript 包管理器,它允许我们轻松地安装和使用各种 npm 包。

    3 年前

相关推荐

    暂无文章