gitbook使用及book.json詳細配置

安裝

安裝命令：1

npm install -g gitbook-cli test

安裝完成以後，你可使用下面的命令來檢驗是否安裝成功。

$ gitbook -V
CLI version: 2.3.2
GitBook version: 3.2.3

使用

• 初始化 gitbook init
  GitBook 準備工做作好以後，咱們進入一個你要寫書的目錄，輸入以下命令。

  $ gitbook init
  warn: no summary file in this book
  info: create README.md
  info: create SUMMARY.md
  info: initialization is finished

  能夠看到他會建立 README.md 和 SUMMARY.md 這兩個文件，README.md 應該不陌生，就是說明文檔，而 SUMMARY.md 其實就是書的章節目錄，其默認內容以下所

  # Summary

若是已經初始化，直接啓動便可

- `啓動本地服務 gitboook serve`  
接下來，咱們輸入 `$ gitbook serve` 命令，而後在瀏覽器地址欄中輸入 `http://localhost:4000`

- 新建目錄

首先咱們來看一下gitbook目錄結構及相關文件



book.json     

主要存放配置信息


  {
  "plugins": [
    "collapsible-menu",
    "anchor-navigation-ex",
    "tbfed-pagefooter",
    "disqus"
  ],
  "title": "發佈業務邏輯梳理",
  "pluginsConfig": {
      "tbfed-pagefooter": {
          "copyright":"Copyright &copy ershouche-FE 2019",
          "modify_label": "文件修訂時間：",
          "modify_format": "YYYY-MM-DD HH:mm:ss"
      },
      "disqus": {
        "shortName": "gitbookuse"
      }
  }
  }




SUMMARY.md  

Gitbook 的章節目錄
![image](https://tva1.sinaimg.cn/large/007S8ZIlly1ggyrd129scj30ng0do41n.jpg)


新增目錄文件時執行gitbook init會自動建立文件到對於目錄下面  

注意：  

最頂層的是一級目錄，縮進一次的是二級目錄，默認會收縮進對應的一級目錄裏面，若是想建立更深層次的目錄結構，就在對應的子目錄下面以縮進的方式建立  

該文件裏面的縮進對於文檔側邊欄目錄的縮進

<img src="https://img.58cdn.com.cn/escstatic/fecar/pmuse/publish/fabu.png" width="200" />

- 構建gitbook build  

執行該命令會生成一個_book文件夾，裏面的內容對於生成的HTML文件

## 配置book.json

### 配置說明

|     變量      |                             描述                             |
| :-----------: | :----------------------------------------------------------: |
|     root      |       包含全部圖書文件的根文件夾的路徑，除了 book.json       |
|   structure   |              指定自述文件，摘要，詞彙表等的路徑              |
|     title     | 您的書名，默認值是從 README 中提取出來的。在 GitBook.com 上，這個字段是預填的。 |
|  description  | 您的書籍的描述，默認值是從 README 中提取出來的。在 GitBook.com 上，這個字段是預填的。 |
|    author     |         做者名。在GitBook.com上，這個字段是預填的。          |
|     isbn      |                      國際標準書號 ISBN                       |
|   language    | 本書的語言類型 —— [ISO code](https://links.jianshu.com/go?to=https%3A%2F%2Fen.wikipedia.org%2Fwiki%2FList_of_ISO_639-1_codes) 。默認值是 `en` |
|   direction   | 文本閱讀順序。能夠是 rtl （從右向左）或 ltr （從左向右），默認值依賴於 language 的值。 |
|    gitbook    |    應該使用的GitBook版本，並接受相似於 `>=3.0.0` 的條件。    |
|     links     |                   在左側導航欄添加連接信息                   |
|    plugins    | 要加載的插件列表([官網插件列表](https://links.jianshu.com/go?to=https%3A%2F%2Fdocs.gitbook.com%2Fv2-changes%2Fimportant-differences%23plugins)) |
| pluginsConfig |                          插件的配置                          |

### 默認插件


- highlight - 語法高亮插件
- search - 搜索插件
- sharing - 分享插件
- font-settings - 字體設置插件
- livereload - 熱加載插件

搜索  

![image-20200716145919634](https://tva1.sinaimg.cn/large/007S8ZIlly1ggstn51gezj30fy04gt8q.jpg)  

字體  

![image-20200716145955656](https://tva1.sinaimg.cn/large/007S8ZIlly1ggstnprwzij30b205wwel.jpg)    

分享  

![image-20200716150040280](https://tva1.sinaimg.cn/large/007S8ZIlly1ggstoianbfj308006zt8t.jpg)  



### 刪除默認插件

在平時開發中好比分享給出的都是一些國外的社交網站 對於咱們沒太大用戶 那麼咱們能夠刪除默認配置

在插件配置在加`-`,配置完執行`gitbook install`便可

plugins: [
  "-sharing"
]

效果以下：  

![image-20200716150604078](https://tva1.sinaimg.cn/large/007S8ZIlly1ggstu43pr7j31qo0icwgl.jpg)  

右側再也不展現分享相關的按鈕

### 經常使用配置

#### 代碼複製

"plugins": [
  "code"
]

效果以下：  

![image-20200720142753077](https://tva1.sinaimg.cn/large/007S8ZIlly1ggxf7nx56kj317q06sjru.jpg)  

代碼複製按鈕

"plugins": [
  "copy-code-button"
]

![image-20200720144333351](https://tva1.sinaimg.cn/large/007S8ZIlly1ggxfnx31w6j318607cjrw.jpg)

#### 目錄摺疊

"plugins": [
  "expandable-chapters"
]

效果以下：  

![image-20200720142951146](https://tva1.sinaimg.cn/large/007S8ZIlly1ggxf9o7rq1j30cm0bcaap.jpg)  

"plugins": [
  "expandable-chapters-small"
]

和上面同樣都是摺疊目錄的，區別就是下面的箭頭要細一些。

效果以下：  

![image-20200720143153085](https://tva1.sinaimg.cn/large/007S8ZIlly1ggxfbrr8ugj30g20egwfe.jpg)  

#### 回到頂部

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

效果以下：  

![image-20200720143530843](https://tva1.sinaimg.cn/large/007S8ZIlly1ggxffk1906j31gu0g40v0.jpg)

#### 高級搜索

去除默認的search搜索和lunr，在搜索結果中，關鍵字會高亮；自帶的 search 插件，關鍵字不會高亮

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

原生搜索效果：  

![image-20200720144425681](https://tva1.sinaimg.cn/large/007S8ZIlly1ggxfotz6s0j31ye0jggro.jpg)

高級搜索：  

![image-20200720144917280](https://tva1.sinaimg.cn/large/007S8ZIlly1ggxftwiu0kj320s0ri12z.jpg)

搜索關鍵字高亮，支持中文、拼音和英文

#### 分享

分享當前頁面，比默認的 sharing 插件多了一些分享方式

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

參數配置裏面true的默認展現圖標，false的默認不展現；all裏面的會在分享按鈕的下拉列表裏面所有展現出來。

效果以下：  

![image-20200720145713703](https://tva1.sinaimg.cn/large/007S8ZIlly1ggxg25dfstj30ie0s8wg1.jpg)

分享效果以下：  

![image-20200720145824437](https://tva1.sinaimg.cn/large/007S8ZIlly1ggxg3dey89j315a0totcl.jpg)

#### 配置頁腳

"plugins": [
     "tbfed-pagefooter"
  ],
  "pluginsConfig": {
      "tbfed-pagefooter": {
          "copyright":"Copyright &copy mine 2000-2020",
          "modify_label": "文件修訂時間：",
          "modify_format": "YYYY-MM-DD HH:mm:ss"
      }
  }

效果以下：  

![image-20200720152236897](https://tva1.sinaimg.cn/large/007S8ZIlly1ggxgskey19j318q03ijrs.jpg)