文章目录自动生成之“toc“插件的使用-Gitbook插件

最新推荐文章于 2024-05-13 09:49:18 发布
最新推荐文章于 2024-05-13 09:49:18 发布
阅读量1.2k 收藏
点赞数
分类专栏： GitBook 生命不息 折腾不止
本文为博主原创文章，未经博主允许不得转载。
本文链接：https://blog.csdn.net/Developer_GuoJinming/article/details/113470698
版权

文章目录

本文概述： 由于笔者之前整理了关于 gitbook 的基础安装与使用相关文章，接下来将介绍 gitbook 各种实用插件的使用，本文中介绍的插件是用于文章中目录生成的插件 toc 的安装配置与使用方法。

原文地址： http://www.crazydeveloper007.com/gitbook-plugins-toc/

开始之前先让我们一起看看最终效果：

图1 最终效果

1 准备工作

1.1 操作系统说明

本文中使用的操作系统为 CentOS 7.8 64bit ，以下的操作与其他发行版本的 Linux 类似，不再赘述。

1.2 gitbook 的安装与使用

详见文章《基于GitBook搭建“线上”知识管理“平台”》
http://www.crazydeveloper007.com/gitbook-setting-

最低0.47元/天 解锁文章
「已注销」
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
gitbook 插件 文章 TOC 目录
爱死亡机器人
06-04 985
page-treeview 插件是生成页内目录不需要插入标签，能支持到6级目录，安装可用安装 配置： 非必要配置： 这个插件生成目录以后，下面有一行关于版权的文字。如果想去掉的话，找到插件目录下的index.js文件： 找到如下这段代码 和 功能相同，在其基础之上修改了以下内容：效果图 simple-page-toc 插件生成本页目录 需要在文章中插入标签，支持1-3级目录 页面顶端生成。另外 GitBook 在处理重复的标题时有些问题，所以尽量不适用重复的标题。安装 配置： 参数 说明
gitbook-plugin-tocstyles:用于自定义目录标题的 GitBook 插件
07-04
用于自定义目录标题的 GitBook 插件 使用以下命令安装它： $ npm install gitbook-plugin-tocstyles 确保也激活book.json文件中的选项： { " plugins " : [ " tocstyles " ] , " pluginsConfig " : { " tocstyles " : [ " " , " cjk-ideographic " , " decimal-leading-zero " ] } } 所述tocstyles阵列中pluginsConfig定义的TOC层级的每个级别。 许可证：麻省理工学院
强大的Markdown TOC生成器——markdown-toc
最新发布
gitblog_00048的博客
05-13 493
强大的Markdown TOC生成器——markdown-toc 项目地址:https://gitcode.com/jonschlinkert/markdown-toc markdown-toc是一个基于Node.js的工具，用于在Markdown文档中自动生成整洁的目录（Table of Contents）。这个开源项目由Jon Schlinkert开发，并得到了广泛的社区支持。如果你经常编写M...
GitBook-auto-summary 根据markdown 标题生成目录文件SUMMARY.md
爱死亡机器人
06-03 1618
我们了解 gitbook plugin summary 自动生成 summary.md 文件内容 这是命令依赖markdown文章名字组成目录结构的样子。 但我的需求是可以依据文章标题来生成整个结构，因为如果你有一批大量的markdown文章一个一个手写改动、添加、删除都是一件非常麻烦的事。我发现来自mofhu/GitBook-auto-summary的功能接近我的需求。 功能：但这离我渴望的需求还差一点点，那就是当文章内容存在标题，我更选择它来做链接名片，当不存在标题再去依赖文章名字（英文或中文）作为链接
gitbook生成目录toc
xo19882011的专栏
03-17 896
默认的gitbook不带目录功能，在markdown里边写上 [toc] 也不生效。 然后发现了一个插件解决了大问题。 插件地址 配置如下： 在gitbook的根目录增加 book.json 文件，增加如下配置，执行 gitbook install 即可。 { "plugins": ["intopic-toc"] } 装完这个插件不用在markdown里边写 [toc] 也可以展示目录。 ...
gitbook:生成目录
dianguanding1120的博客
07-16 1306
问题： gitbook不支持markdown的TOC命令自动生成目录。 解决方案： 使用gitbook插件gitbook-plugin-toc。 在book.json中添加 { "plugins": ["toc"] } 在book.json所在目录运行gitbook install，安装完成后，在使用TOC命令的地方使用<!-- toc -->代替。即可自动生成文档目...
gitbook nodejs 版本问题 toc问题（生成目录）
woflyoycm的博客
11-25 1894
安装最新版本的gitbook（3.2.3）和nodejs（14.15.1）后，出现问题，无法成功的使用gitbook init初始化文档结构 会报错（gitbook中的graceful-fs包的的polyfill.js），估计是版本不兼容。 这里将最新版本nodejs卸载，改为10.23.0版本后，使用cnpm安装最新版gitbook，gitbook终于可以正常使用，记录一下 ...
markdown toc 生成--自动生成markdown文档侧边栏目录
03-06
本资源提供了一个简单方法，用于生成华丽的markdown文档侧边栏目录。本资源包含一个模板文档，没有任何程序代码，简单易用。本模板是对开源项目 i5ting-i5ting_ztree_toc-0.3.0-11 的精简，主要是针对Windows下无法...
2021-06-19 jquery目录插件tocify
gossipcy的博客
06-19 259
jquery目录插件tocify 插件下载链接：https://codeload.github.com/gfranko/jquery.tocify.js/zip/refs/heads/master 插件使用方法： 1.在demeos下有默认的default.html文件，打开是默认的目录自动生成样式。 2.注意引入default.html中的css文件和js文件，确保路径正确。在thymeleaf中，如下使用方法。 ...
gitbook安装使用看完这一篇就够了
热门推荐
YunWQ的博客
09-09 1万+
Gitbook使用教程 GitBook安装 GitBook是一个能将使用 Markdown 语法，快速制作成各种格式电子书的工具。它是一个基于 Node.js 的命令行工具，可以用来制作精美的电子书。首先我们得下载Nodejs并安装 注意: 截止到目前的 Gitbook V3.2.3版本，需要使用NodeJs的v10+版本，否则会产生各种报错。 这里建议下载v10.23.1版本，官网最新版本我试了也是不行的。 先安装Nodejs nodejs历史版本下载连接 https://nodejs.org/zh-
解决GitBook不支持[TOC]生成的本页目录
DevOps海洋的渔夫@专栏
04-18 1929
问题如下 在编写GitBook的过程中，不可能避免有些篇章会篇幅比较长，此时就会想到markdown有个[TOC]可以生成目录。 但是在使用GitBook运行服务gitbook serve打开页面的时候，却是不支持的，如下图： 正常文档中的显示如下： 那么有没有什么好办法去处理呢？ 解决方法 发现Github的一个项目https://github.com...
什么是TOC？ 论文不通过？TOC请了解一下 ｜ SCI-HUA科画技法
whiteareas的博客
03-28 1万+
本期SCI-HUA科画介绍的是高水准科研绘图的信息表达。 附「SCI论文是什么？」 Please note which of your figures is the one to be used as the graphical abstract (TOC) for your manuscript. 当你收到科研论文反馈邮件中出现这段文字，你可能还不知道接下来应该做什么 ...
复盘-SCI论文TOC的绘制
博客而已
02-26 2157
这次绘制论文的TOC也去查了不少资料和观看视频学习，将学习到的内容复盘在这里。以上是关于TOC的复盘，这个阶段就总结复盘完了，之后还有学习内容还会回来总结在这儿，完结撒花！
gitbook基础用法
y8sq55的博客
07-31 137
gitbook -V 查看版本号gitbook ls 列出本地全部的gitbook版本gitbook init 初始化gitbook install 安装插件gitbook serve 预览gitbook build 生成gitbook build --gitbook=2.6.7 生成时指定gitbook的版本, 本地没有会先下载gitbook uninstall 2.6.7 卸载指定版本号的gitbookgitbook fetch [version] 获取[版本]下载并安装<版本>
gitbook 搭建自己的技术站
weixin_41815063的博客
01-16 2599
为什么要搭建自己的book呢？ 做只属于自己的一本技术管理书籍，目录清晰明朗，方便自己查阅，最最重要的就是以防电脑硬件故障，丢失自己最心爱的笔记。。。。 快速上手、 打开命令窗口，执行下面的一系列操作。。。 安装 cnpm install gitbook-cli -g gitbook -V //查看版本号 gitbook init book //...
gitbook 简单安装
vbaspdelphi的专栏
01-11 1018
npm安装以及修改mirroryum install -y nodejsnpm config set registry https://registry.npm.taobao.orgnpm config get registry安装模块npm install gitbook gitbook-cli -g npm install -g gitbook-plugin-mermaid npm instal
gitbook+ doctoc构建github pages
pgLi
11-22 259
1、安装doctoc 用doctoc生成的目录放到SUMMARY中点击菜单可滑到对应位置 npm i doctoc 2、gitbook编译 1、根目录下创建book.json，并添加常用的配置。 gitbook install下载插件 { "title": "utils工具函数", "language": "zh-hans", // 简体中文 "author": "pgli", "gitbook": "3.2.3", "root": ".", "links"
Markdown使用TOC自动生成导航栏
weixin_30929295的博客
06-11 5871
经常使用markdown 的玩家一定很想要一个自动生成的导航栏吧，自己写的基本思路就是 轮询监听滚动条的位置，通过抛锚和跳锚实现，这里介绍一下今天的主角，markdown-toc插件： https://github.com/jonschlinkert/markdown-toc # 0x00 安装 TOC = Table of content ， 将内容制作成导航 这个插件是基...
project-tree插件生成项目目录结构，略指定文件夹
pacong的博客
02-02 938
文件里的目录也给打印出来了，但是我们不需要这个目录树，我们在项目的忽略文件里，写上要或忽略的文件或文件夹。关于或略文件怎么写，可以看看git忽略文件。文件里生成新的打印，这样就清爽多了。先把项目直接放到vscode里。文件里生成项目目录树。
vue markdown toc 生成--自动生成markdown文档侧边栏目录
05-26
在 Vue 中使用 Markdown 渲染文档时，如果文档内容比较长，我们需要为用户提供侧边栏目录导航，方便用户快速定位到所需部分。下面是一个简单的方法来实现自动生成 Markdown 文档的侧边栏目录。 首先，我们需要安装 `markdown-it` 和 `markdown-it-toc`： ```bash npm install markdown-it markdown-it-toc --save ``` 然后，在 Vue 组件中引入并使用它们： ```javascript <template> <div> <!-- 目录导航 --> <div v-html="toc"></div> <!-- Markdown 内容 --> <div v-html="html"></div> </div> </template> <script> import MarkdownIt from 'markdown-it' import MarkdownItToc from 'markdown-it-toc' export default { data() { return { markdown: '# 一级标题\n\n## 二级标题\n\n### 三级标题', toc: '', // 目录导航 html: '', // 渲染后的 HTML } }, mounted() { // 解析 Markdown 文档 const md = new MarkdownIt() md.use(MarkdownItToc, { tocFirstLevel: 1 }) const result = md.render(this.markdown) // 生成目录导航 this.toc = md.toc // 渲染 Markdown 内容 this.html = result }, } </script> ``` 在上面的代码中，我们使用了 `markdown-it-toc` 插件来自动生成目录导航，并将导航内容存储在 `toc` 变量中。然后，我们使用 `v-html` 指令将导航和 Markdown 文档内容渲染到页面上。 注意，`markdown-it-toc` 插件需要在解析 Markdown 文档之前使用 `md.use(MarkdownItToc)` 方法来注册。在注册时，我们可以设置 `tocFirstLevel` 属性来指定目录导航的起始层级，默认为 `1`。 最后，我们需要使用 CSS 样式来美化目录导航和 Markdown 内容，以便更好地展示给用户。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值