Use and application of gitbook book.json Detailed configuration

Time:2021-2-23

install

Installation command: 1

npm install -g gitbook-cli test

After the installation is complete, you can use the following command to check whether the installation is successful.

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

use

  • Initialize gitbook init
    After getting ready for gitbook, let’s go to a directory where you want to write a book and enter the following command.

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

    You can see that he will create README.md And SUMMARY.md These two documents, README.md Should not be unfamiliar, that is, documentation, rather than SUMMARY.md In fact, it is the chapter directory of the book, and its default content is as follows

    # Summary
    
If it has been initialized, it can be started directly

-Start the local service gitbook serve`  
Next, we enter the '$gitbook serve' command, and then enter it in the browser address bar` http://localhost :4000`

-New directory

First, let's look at the gitbook directory structure and related files



book.json     

Main storage configuration information


  {
  "plugins": [
    "collapsible-menu",
    "anchor-navigation-ex",
    "tbfed-pagefooter",
    "disqus"
  ],
  "Title": "publishing business logic sorting,",
  "pluginsConfig": {
      "tbfed-pagefooter": {
          "copyright":"Copyright &copy ershouche-FE 2019",
          "modify_ Revision time of the document,
          "modify_format": "YYYY-MM-DD HH:mm:ss"
      },
      "disqus": {
        "shortName": "gitbookuse"
      }
  }
  }




SUMMARY.md  

Chapter contents of gitbook
![image](https://imgs.developpaper.com/imgs/007S8ZIlly1ggyrd129scj30ng0do41n.jpg)


When adding a new directory file, executing gitbook init will automatically create the file under the corresponding directory  

be careful:  

The top-level directory is the first level directory, and the second level directory is indented once. By default, it will be indented into the corresponding first level directory. If you want to create a deeper directory structure, you can create it by indenting under the corresponding subdirectory  

The indentation in this file is the indentation of the document sidebar directory

<img width="200" />

-Building gitbook build  

Executing this command generates a_ Book folder, the contents of which for the generated HTML file

##Configuration book.json

###Configuration description

|Variable | description|
| :-----------: | :----------------------------------------------------------: |
|Root | the path to the root folder containing all book files, except book.json        |
|Structure | specifies the path to the readme file, summary, vocabulary, etc|
|Title | your book title. The default value is extracted from readme. In GitBook.com  In this case, this field is pre filled. |
|Description | the description of your book. The default value is extracted from readme. In GitBook.com  In this case, this field is pre filled. |
|Author | author's name. stay GitBook.com In this case, this field is pre filled. |
|ISBN | ISBN|
|Language | language types of this book - [ISO code]( https://links.jianshu.com/go?to=https%3A%2F%2Fen.wikipedia.org%2Fwiki%2FList_ of_ ISO_ 639-1_ codes) 。 The default value is ` en ~|
|Direction | text reading order. It can be RTL (from right to left) or LTR (from left to right), and the default value depends on the value of language. |
|Gitbook | should use gitbook version, and accept conditions similar to '> = 3.0.0'. |
|Links | add link information to the left navigation bar|
|Plugins | list of plug-ins to load ([official website plug-in list]( https://links.jianshu.com/go?to=https%3A%2F%2Fdocs.gitbook.com%2Fv2-changes%2Fimportant-differences%23plugins )) |
|Configuration of pluginsconfig | plug in|

###Default plug in


-Highlight - syntax highlight plug in
-Search - Search plug in
-Sharing - sharing plug in
-Font settings - font settings plug in
-Livereload - hot load plug in

search  

![image-20200716145919634](https://imgs.developpaper.com/imgs/007S8ZIlly1ggstn51gezj30fy04gt8q.jpg)  

typeface  

![image-20200716145955656](https://imgs.developpaper.com/imgs/007S8ZIlly1ggstnprwzij30b205wwel.jpg)    

share  

![image-20200716150040280](https://imgs.developpaper.com/imgs/007S8ZIlly1ggstoianbfj308006zt8t.jpg)  



###Remove default plug-in

在平时开发中比如share给出的都是一些国外的社交网站 对于我们没太大用户 那么我们可以删除默认配置

Add '-' to the plug-in configuration, and execute 'gitbook install' after configuration

plugins: [
  "-sharing"
]

The results are as follows  

![image-20200716150604078](https://imgs.developpaper.com/imgs/007S8ZIlly1ggstu43pr7j31qo0icwgl.jpg)  

右侧不再展示share相关的按钮

###Common configuration

####Code duplication

"plugins": [
  "code"
]

The results are as follows  

![image-20200720142753077](https://imgs.developpaper.com/imgs/007S8ZIlly1ggxf7nx56kj317q06sjru.jpg)  

Code copy button

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

![image-20200720144333351](https://imgs.developpaper.com/imgs/007S8ZIlly1ggxfnx31w6j318607cjrw.jpg)

####Catalog collapse

"plugins": [
  "expandable-chapters"
]

The results are as follows  

![image-20200720142951146](https://imgs.developpaper.com/imgs/007S8ZIlly1ggxf9o7rq1j30cm0bcaap.jpg)  

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

It's the same as above. The difference is that the arrow below should be smaller.

The results are as follows  

![image-20200720143153085](https://imgs.developpaper.com/imgs/007S8ZIlly1ggxfbrr8ugj30g20egwfe.jpg)  

####Back to the top

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

The results are as follows  

![image-20200720143530843](https://imgs.developpaper.com/imgs/007S8ZIlly1ggxffk1906j31gu0g40v0.jpg)

#### 高级search

去除默认的searchsearch和lunr,在search结果中,关键字会高亮;自带的 search 插件,关键字不会高亮

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

原生search效果:  

![image-20200720144425681](https://imgs.developpaper.com/imgs/007S8ZIlly1ggxfotz6s0j31ye0jggro.jpg)

高级search:  

![image-20200720144917280](https://imgs.developpaper.com/imgs/007S8ZIlly1ggxftwiu0kj320s0ri12z.jpg)

search关键字高亮,支持中文、拼音和英文

#### share

share当前页面,比默认的 sharing 插件多了一些share方式

"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里面的会在share按钮的下拉列表里面全部展示出来。

The results are as follows  

![image-20200720145713703](https://imgs.developpaper.com/imgs/007S8ZIlly1ggxg25dfstj30ie0s8wg1.jpg)

shareThe results are as follows  

![image-20200720145824437](https://imgs.developpaper.com/imgs/007S8ZIlly1ggxg3dey89j315a0totcl.jpg)

####Configure footers

"plugins": [
     "tbfed-pagefooter"
  ],
  "pluginsConfig": {
      "tbfed-pagefooter": {
          "copyright":"Copyright &copy mine 2000-2020",
          "modify_ Revision time of the document,
          "modify_format": "YYYY-MM-DD HH:mm:ss"
      }
  }

The results are as follows  

![image-20200720152236897](https://imgs.developpaper.com/imgs/007S8ZIlly1ggxgskey19j318q03ijrs.jpg)