关于gitbook的结构及优化配置

Just_Paranoid

已于 2023-05-23 14:03:33 修改

阅读量3k

点赞数

分类专栏：技术流Clip 文章标签： gitbook npm

于 2021-03-16 19:50:17 首次发布

本文链接：https://blog.csdn.net/weixin_44008788/article/details/113920083

版权

技术流Clip 专栏收录该内容

43 篇文章 6 订阅

订阅专栏

gitbook基本结构

├── book.json
├── README.md
├── SUMMARY.md
├── chapter1/
|    ├── README.md
|    ├── something.md
├── chapter2/
|    ├── README.md

SUMMARY.md中[]内的内容是标题，()内是文档的路径，章节和子章节用四个空格或者tab键来分级，菜单示例：

# 概述
### 服务介绍
* [服务介绍](README.md)

### 服务接入流程

* [服务开通](serviceOpen.md)
* [应用配置](appConfig.md)

### 企业实名认证服务端API
* [API服务规范](apiStandard.md)
* [营业执照OCR接口](apiOCR.md)

book.json的配置说明

变量	描述
root	包含所有图书文件的根文件夹的路径，除了 book.json
structure	指定自述文件，摘要，词汇表等的路径
title	您的书名，默认值是从 README 中提取出来的。在 GitBook.com 上，这个字段是预填的。
description	您的书籍的描述，默认值是从 README 中提取出来的。在 GitBook.com 上，这个字段是预填的。
author	作者名。在GitBook.com上，这个字段是预填的。
isbn	国际标准书号 ISBN
language	本书的语言类型，默认值是 `en`
direction	文本阅读顺序。可以是 rtl （从右向左）或 ltr （从左向右），默认值依赖于 language 的值。
gitbook	应该使用的GitBook版本，并接受类似于 `>=3.0.0` 的条件。
links	在左侧导航栏添加链接信息
plugins	要加载的插件列表
pluginsConfig	插件的配置

基本配置

{
	"title": "Gitbook Use",
	"author": "Jian Fangjian <fangjian98@gmail.com>",
	"description": "This is a sample book created by gitbook",
	"language": "zh-hans",
}

title - 设置书本的标题
author - 作者的相关信息
description - 本书的简单描述
language - 语言
en, ar, bn, cs, de, en, es, fa, fi, fr, he, it, ja, ko, no, pl, pt, ro, ru, sv, uk, vi, zh-hans, zh-tw
links - 在左侧导航栏添加链接信息
styles - 自定义页面样式，默认情况下各generator对应的css文件
"styles": { "website": "styles/website.css", }

默认插件

默认带有 5 个插件：

highlight - 语法高亮插件
search - 搜索插件
sharing - 分享插件
font-settings - 字体设置插件
livereload - 热加载插件

去除默认插件，可以在插件名称前面加 -

常用插件

在book.json写入相应插件plugins和配置pluginsConfig后，使用gitbook install安装插件

npm插件：https://www.npmjs.com/

gitbook-plugin-insert-logo 图标

	"plugins": [
		"insert-logo"
	],

	"pluginsConfig": {
		"insert-logo": {
			"url": "https://fangjian98.gitee.io/gitbook/images/android.png",
			"style": "background: none; max-height: 30px; min-height: 30px"
		}
	},

hide-element 隐藏元素

默认的gitbook左侧提示：Published with GitBook

{
    "plugins": [
        "hide-element"
    ],
    "pluginsConfig": {
        "hide-element": {
            "elements": [".gitbook-link"]
        }
    }
}

back-to-top-button 回到顶部

当文章篇幅较长时，页面底部会显示按钮，一键点击自动回到顶部

{
    "plugins": [
         "back-to-top-button"
    ]
}

gitbook默认目录没有折叠效果
或者expandable-chapters-small

{
    "plugins": ["chapter-fold"]
}

code 复制代码

在代码域的右上角添加一个复制按钮，点击一键复制代码。

{
    "plugins" : [ "code" ]
}

splitter 侧边栏宽度可调节

左侧目录和右侧文章可以拖动调节宽度。

{
    "plugins": [
        "splitter"
    ]
}

search-pro 高级搜索

支持中英文，准确率更高一些

{
    "plugins": [
          "-lunr", 
          "-search", 
          "search-pro"
    ]
}

insert-logo 插入logo

在左侧导航栏上方插入logo
url支持本地图片也支持网络图片链接

{
    "plugins": [ "insert-logo" ]
    "pluginsConfig": {
      "insert-logo": {
        "url": "images/logo.png",
        "style": "background: none; max-height: 30px; min-height: 30px"
      }
    }
}

pageview-count 阅读量计数

记录每个文章页面被访问的次数

{
  "plugins": [ "pageview-count"]
}

custom-favicon 修改标题栏图标

设置浏览器选项卡标题栏的小图标
注意只支持ico后缀的图片，并且只支持本地图片，不支持网络图片链接。
图标的分辨率要是32x32的。

{
    "plugins" : ["custom-favicon"],
    "pluginsConfig" : {
        "favicon": "icon/favicon.ico"
    }
}

tbfed-pagefooter 页面添加页脚

在每个文章下面标注版权信息和文章时间

{
    "plugins": [
       "tbfed-pagefooter"
    ],
    "pluginsConfig": {
        "tbfed-pagefooter": {
            "copyright":"Copyright &copy dsx2016.com 2019",
            "modify_label": "该文章修订时间：",
            "modify_format": "YYYY-MM-DD HH:mm:ss"
        }
    }
}

popup 弹出大图

点击可以在新窗口展示图片

{
  "plugins": [ "popup" ]
}

sharing-plus 分享当前页面

gitbook默认只有Facebook、Google+、Twiter、Weibo、Instapaper
插件可以有更多分享方式，也可以关闭指定分享方式。

{
    "plugins": ["-sharing", "sharing-plus"],
    "pluginsConfig": {
        "sharing": {
             "douban": true,
             "facebook": true,
             "google": true,
             "pocket": true,
             "qq": true,
             "qzone": true,
             "twitter": true,
             "weibo": true,
          "all": [
               "douban", "facebook", "google", "instapaper", "linkedin","twitter", "weibo", 
               "messenger","qq", "qzone","viber","whatsapp"
           ]
       }
    }
}

change_girls 可自动切换的背景

"plugins":["change_girls"]
 
"pluginsConfig": {
    
    "change_girls" : {
        "time" : 5,
        "urls" : [
            "girlUrl1", "girlUrl2",...
        ]
    }
}

emphasize强调突出颜色

{
    "plugins": ["emphasize"]
}

This text is {% em %}highlighted !{% endem %}
 
This text is {% em %}highlighted with **markdown**!{% endem %}
 
This text is {% em type="green" %}highlighted in green!{% endem %}
 
This text is {% em type="red" %}highlighted in red!{% endem %}
 
This text is {% em color="#ff0000" %}highlighted with a custom color!{% endem %}

page-copyright 页面页脚版权（内容多）：

https://www.npmjs.com/package/gitbook-plugin-page-copyright

运行以后有很多信息是原创作者的，这些配置都在你的插件安装目录\node_modules\gitbook-plugin-page-copyright下的index.js中，自己可以修改，大部分信息都在 defaultOption 中。其二维码可以在文件中找到 QRcode 改成自己的，或者直接把所有的 defaultOption.isShowQRCode改成false

page-toc-button悬浮目录
anchor-navigation-ex
page-treeview
donate打赏
flexible-alerts警报
klipse 嵌入类似IDE的功能

{
    "plugins": ["klipse"]
}

用法，在 markdown 中

```eval-python
    print [x + 1 for x in range(10)]
```

sidebar-style 导航栏显示作者信息

会替换掉 Published by GitBook

{
    "plugins": ["sidebar-style"],
    "pluginsConfig": {
        "sidebar-style": {
            "title": "前端开发",
            "author": "付铭"
        }
    }
}