npm 包 gitbook-plugin-anchorjs 使用教程

什么是 gitbook-plugin-anchorjs

gitbook-plugin-anchorjs 是一个用于 GitBook 的插件,可以为文章中的标题生成锚点,并在标题上自动添加一个复制链接的按钮,方便读者复制文章中的标题链接。

如何安装 gitbook-plugin-anchorjs

使用 npm 安装 gitbook-plugin-anchorjs:

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

如何配置 gitbook-plugin-anchorjs

在 GitBook 的 book.json 文件中添加以下配置:

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

在上面的配置中,selector 用于指定需要生成锚点和复制链接的标题级别,这里选择了 h1、h2 和 h3 标题。

如何使用 gitbook-plugin-anchorjs

安装并配置好 gitbook-plugin-anchorjs 后,所有符合 selector 的标题都会自动添加上锚点和复制链接的按钮。

例如,下面是一个包含多个标题的 GitBook 示例:

- ---

-------

-- ---

--------

--- ---

--------

-- ---

---------

使用 gitbook-plugin-anchorjs 后,GitBook 渲染后的效果如下图所示:

读者可以点击标题后的锚点链接跳转到对应的标题位置,并点击标题后的复制链接按钮复制该标题的链接地址。

总结

gitbook-plugin-anchorjs 是一个非常实用的 GitBook 插件,可为文章中的标题自动添加锚点并生成复制链接的按钮,方便读者阅读和分享文章。使用时,需要先安装并配置好 gitbook-plugin-anchorjs,然后在书籍中适当添加需要生成锚点的标题即可。

来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/5eedaa9db5cbfe1ea061052c


猜你喜欢

  • npm 包 @hapi/pez 使用教程

    前言 随着前端技术的不断发展,开发者们需要掌握更多的工具和框架。今天我们要学习的是一个非常实用的 npm 包:@hapi/pez。这个包可以帮助我们处理 RESTful API 请求中的参数。

    4 年前
  • npm 包 event-loop-stats 使用教程

    JavaScript 是一门单线程语言,因此 JavaScript 应用程序的运行顺序被称为事件循环(event loop)。其中,事件循环的工作机制就是不断的从任务队列中取出任务执行。

    4 年前
  • npm包gc-stats的使用教程

    本文将介绍一款 npm 包 gc-stats,包括它的作用、应用场景以及如何使用。gc-stats 可以记录 Node.js 的垃圾回收事件,从而提高代码的性能,并且具有广泛的应用。

    4 年前
  • npm 包 Lockfile-lint-api 使用教程

    简介 在使用 npm 安装依赖包时,会自动生成一个 lockfile 文件,用于记录依赖包的版本信息,以保证团队开发中依赖包的版本一致性。但是 lockfile 文件的格式较为复杂,在手动管理时可能会...

    4 年前
  • npm 包 lockfile-lint 使用教程

    什么是 lockfile-lint lockfile-lint 是一款在 npm 包管理中使用的工具,用于确保 package-lock.json 文件中的依赖关系列表与 package.json 文...

    4 年前
  • npm 包 node-nats-streaming 使用教程

    简介 node-nats-streaming 是一个 Node.js 的 NATS Streaming 客户端库,支持 NATS Streaming 消息队列协议。

    4 年前
  • npm 包 winston-spy 使用教程

    前言 日志是开发过程中必不可少的一环,而 winston 是一个基于 Node.js 的既简单又灵活的日志库,可以轻松地通过它来记录应用中的日志信息。winston-spy 是 winston 的扩展...

    4 年前
  • npm 包 winston-context 使用教程

    前言 在日常的前端开发中,日志是十分重要的一部分。而对于 Node.js 服务的日志管理,通常我们会使用 Winston 这个 Node.js 的日志管理库。然而,Winston 原生的便捷性还是有待...

    4 年前
  • npm包@seneca/inquirer使用教程

    前言 在现代Web开发中,前端开发人员经常要使用到各种第三方库来简化开发过程,其中npm是最常用的包管理工具之一。而在npm的庞大代码库中,@seneca/inquirer是一个非常常用的库。

    4 年前
  • npm包@seneca/vorpal使用教程

    什么是npm包@seneca/vorpal? npm包@seneca/vorpal是一个命令行交互工具,可以帮助开发者快速搭建基于命令行的程序。它基于Node.js,通过简洁的API和插件机制,提供优...

    4 年前
  • npm 包 @voxgig/swim 使用教程

    前言 在 Web 开发过程中,前端开发人员经常需要使用很多开源库来完成复杂的任务。在 Node.js 平台上,npm 是最受欢迎的包管理器之一。它提供了一个很好的方式来查找和使用各种库和插件。

    4 年前
  • npm包seneca-entity使用教程

    在前端开发中,组件的重复利用是很重要的,而npm包是一个很好的工具,可以方便地实现组件的复用。这篇文章介绍了如何使用npm包seneca-entity来实现数据管理。

    4 年前
  • npm 包 seneca-mem-store 使用教程

    在前端开发中,经常需要使用到数据存储和管理。seneca-mem-store 是一个轻量的内存存储库,可以提供对应用程序数据的快速访问和处理。 安装 seneca-mem-store 在项目的根目录使...

    4 年前
  • npm 包 seneca-promisify 使用教程

    如果你是一位前端开发人员,你一定是不陌生 npm 这个包管理器。同时,你可能还会用到一些 Node.js 框架和库,如 Seneca。在本文中,我们将探讨如何使用 npm 包 seneca-promi...

    4 年前
  • npm 包 template-literal-table 使用教程

    在前端开发的过程中,我们经常需要在页面中展示一个表格,使用HTML标签手写表格的代码十分复杂且冗长。而 npm 包 template-literal-table 提供了一种简单且优雅的方式来快速创建表...

    4 年前
  • npm 包 @ggoodman/ts-lib-tools 使用教程

    随着 TypeScript 在前端开发中的日益流行,越来越多的开发者开始关注 TypeScript 库的构建和发布。在 TypeScript 库的构建过程中,使用工具可以极大地提高开发效率,@ggoo...

    4 年前
  • npm包@types/lodash.includes使用教程

    简介 在前端开发过程中,我们经常需要处理数组和对象。无论是在开发阶段还是在生产环境中,经常需要使用一些常用的工具库来提高效率。Lodash是一个非常流行的JavaScript工具库,提供了各种方便快捷...

    4 年前
  • npm 包 @wdio/config 使用教程

    什么是 @wdio/config @wdio/config 是一个用于配置 WebdriverIO 的 npm 包,它提供了一套简单易用的配置方法来设置您的 WebdriverIO 测试框架环境,使您...

    4 年前
  • npm 包 @types/lodash.xor 使用教程

    介绍 在前端开发中,经常需要对数组进行一些操作,而 Lodash 是一个非常好用的 JavaScript 工具库,提供了丰富的数组操作函数,其中 xor 函数是用来求两个数组的差集(即在一个数组中但不...

    4 年前
  • npm包@wdio/logger使用教程

    前言 在前端开发中,日志是非常重要的工具,可以帮助我们快速地排查错误,定位问题。webdriver.io 是一个很好的前端自动化测试框架,它使用了 @wdio/logger 这个 npm 包来处理日志...

    4 年前

相关推荐

    暂无文章