本文主要是介绍GitBook安装及使用——使用 Markdown 创建你自己的博客网站和电子书,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
目录
- 前言
- 一、依赖环境
- 二、gitbook安装使用
- 1.安装 gitbook-cli
- 2.安装 gitbook
- 3.Gitbook初始化
- 4.创建你的文章
- 5.修改 SUMMARY.md 和 README.md
- 6.编译生成静态网页
- 7.运行以便在浏览器预览
- 8.运行效果
- 三、使用插件
- 1.新建 book.json 文件
- 2.配置插件
- 3.安装插件
- 其他说明:
- (1) 关于 gitbook-plugin-prism
- (2)内容铺满
- 4.效果
前言
GitBook是一个命令行工具,用于使用 Markdown 构建漂亮的博客网站、电子书籍,相比于 VuePress,它更简洁,用起来也更方便。
GitBook的 github 地址 : gitbook
一、依赖环境
使用 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:287if (cb) cb.apply(this, arguments)^TypeError: cb.apply is not a functionat E:\nodejs\node_global\node_modules\gitbook-cli\node_modules\npm\node_modules\graceful-fs\polyfills.js:287:18at 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 中进行配置:
gtibook 插件侧边导航、推荐12个实用的gitbook插件、gitbook常用的插件、Gitbook插件的配置和使用详解、gitbook部署网站
下面是我的 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
启动服务,查看效果
这篇关于GitBook安装及使用——使用 Markdown 创建你自己的博客网站和电子书的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!