GitBook安装及使用——使用 Markdown 创建你自己的博客网站和电子书

GitBook安装及使用——使用 Markdown 创建你自己的博客网站和电子书GitBook 是一个命令行工具 用于使用 Markdown 构建漂亮的博客网站 电子书籍 相比于 VuePressdocu 等工具 它更简洁 用起来也更方便

大家好,欢迎来到IT知识分享网。

前言

GitBook是一个命令行工具,用于使用 Markdown 构建漂亮的博客网站、电子书籍,相比于 VuePress、docusaurus 等工具,它更简洁,用起来也更方便。

例如:JavaFX 前言

这个博客网站就是使用 GitBook 生成的,你只需要使用 Markdown 来书写文章内容,其他的 GitBook 帮你搞定。

另外关于 GitBook 的其他信息可参考 github 地址 : gitbook

(由于 gitbook 已不再维护,要安装使用 gitbook 则 nodejs 版本不能太高,你也可以使用 honkit 来代替 gitbook ,honkit 使用说明 gitbook-cli早已停止维护,推荐使用其分支honkit)

一、依赖环境

使用 gitbook , 需要先安装 Node.js ,且版本不能太高,否则后面安装过程会报错,这里推荐 10.24.1 版本。

如果你已经安装了高版本的 Node.js 要先卸载,然后安装低版本的,可以去官网 下载Node.js 10.24.1 版本,参考 Node.js安装与配置 进行安装;

或者卸载后使用 nvm 安装切换多个 Node.js 版本。

二、gitbook安装使用

1.安装 gitbook-cli

npm install gitbook-cli -g 

2.安装 gitbook

执行下面的命令进行安装 gitbook

gitbook -V 

安装速度比较慢,等上个几分钟,不出意外就安装成功了。

请添加图片描述

如果出现下面的报错,说明 Node.js 版本太高,需要根据上面提到的降低 Node.js 版本,或使用 nvm 安装低版本 Node.js

CLI version: 2.3.2 Installing GitBook 3.2.3 E:\nodejs\node_global\node_modules\gitbook-cli\node_modules\npm\node_modules\graceful-fs\polyfills.js:287 if (cb) cb.apply(this, arguments) ^ TypeError: cb.apply is not a function at E:\nodejs\node_global\node_modules\gitbook-cli\node_modules\npm\node_modules\graceful-fs\polyfills.js:287:18 at FSReqCallback.oncomplete (node:fs:200:5) 

3.Gitbook初始化

新建一个文件夹如 myBook,命令行中使用 cd 命令进入到该文件夹下,在该文件夹下执行下面的命令进行初始化:

gitbook init 

会自动在目录中生成两个文件,

  • SUMMARY.md :所有文章的列表目录
  • README.md :说明文件

4.创建你的文章

我这里新建了两个文件夹。一个用来存放 java 相关的 Markdown 文章,一个用来存放 python 相关的 Markdown 文章。

目录结构如下:

└─ myBook ├─ java │ ├─ socketAndNetty.md │ └─ stream.md ├─ python │ ├─ JSON.md │ ├─ openpyxl.md │ └─ spider.md ├─ README.md └─ SUMMARY.md 

5.修改 SUMMARY.md 和 README.md

SUMMARY.md

# Summary * [介绍](README.md) * [java](README.md) * [socket和Netty使用](java/socketAndNetty.md) * [stream.md使用](java/stream.md) * [python](README.md) * [JSON格式转换](python/JSON.md) * [Excel处理](python/openpyxl.md) * [爬虫](python/spider.md) 

README.md

# 介绍 你好,欢迎来到我的博客,这里主要是 java 和 python 相关的教程 ━(*`∀´*)ノ亻! 

6.编译生成静态网页

执行下面的命令,将会在 myBook 目录下生成一个_book文件夹,这就是我们的一个静态站点

gitbook build 

7.运行以便在浏览器预览

执行下面的命令:

gitbook serve 

会运行一个服务器, 通过浏览器访问 http://localhost:4000/ 便可以预览博客

8.运行效果

在这里插入图片描述

三、使用插件

gitbook 自带了一些插件,比如在上面效果图里左上角的搜索框、右上角的分享图标等,关于自带插件的使用和关闭可参考这篇文章:Gitbook插件

此外我们还可以安装其他插件进行使用。

1.新建 book.json 文件

在项目根路径下新建 book.json 文件,用于配置插件

2.配置插件

下面是我的 book.json 文件的配置:

{ 
    "language" : "zh-hans", "structure": { 
    "readme": "README.md" }, "plugins": [ "-lunr", "-sharing", "-search", "search-pro", "sidebar-style", "code", "splitter", "expandable-chapters", "anchor-navigation-ex", "-highlight", "prism", "popup" ], "pluginsConfig": { 
    "sidebar-style": { 
    "title": "JAVA和Python教程", "author": "西凉" } } } 

3.安装插件

执行下面的命令进行安装插件:

gitbook install 

或者,你也可以使用 npm install gitbook-plugin-插件名 命令分别去安装上面 book.json 里配置的插件,而且速度也更快。例如,安装 book.json 里配置的anchor-navigation-ex 插件可以使用下面的命令安装:

npm i gitbook-plugin-anchor-navigation-ex 

其他说明:

(1) 关于 gitbook-plugin-prism

上面配置文件中配置了 gitbook-plugin-prism代码块高亮插件,
安装插件后,若不想使用默认的高亮背景,可更换其主题颜色,可在 node_modules/prismjs/themes/目录下可进行选择主题,然后可在book.json 配置文件设置,
例如 :

"pluginsConfig": { 
    "prism": { 
    "css": [ "prismjs/themes/prism-solarizedlight.css" ] } } 
(2) 内容铺满

如果你想把文章内容铺满,即让文章内容与左边和右边间距小一些,可在 ‘_book/gitbook/style.css’ 文件中搜索 page-inner ,将里面的 max-width:800px 修改 max-width:1300px

下面是铺满的效果:

在这里插入图片描述

4.效果

使用命令 gitbook serve 启动服务,查看效果

在这里插入图片描述

免责声明:本站所有文章内容,图片,视频等均是来源于用户投稿和互联网及文摘转载整编而成,不代表本站观点,不承担相关法律责任。其著作权各归其原作者或其出版社所有。如发现本站有涉嫌抄袭侵权/违法违规的内容,侵犯到您的权益,请在线联系站长,一经查实,本站将立刻删除。 本文来自网络,若有侵权,请联系删除,如若转载,请注明出处:https://haidsoft.com/132301.html

(0)
上一篇 2025-08-01 16:10
下一篇 2025-08-01 16:20

相关推荐

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注微信