GitBook使用教程（入门）

Gitbook是一个基于npm构建电子书网站的工具。它的主要作用是在本机环境下搭建一个电子书网站（也可以搭建私人网站，这个需要到运营商那里购买个人域名），并能在浏览器上通过localhost端口号访问（也能提供电子书给局域网其他用户访问）。

话不多说，让我们先感受一下GitBook构建的电子书网站大概是什么样子：

https://www.sensorsdata.cn/manual/data_import.html

如果你需要建立一个自己的知识库，时刻来记录自己的学习笔记，或者需要提供给别人一个文档，那么使用GitBook是一个不错的选择。接下来我们就来学习如何搭建自己的电子书网站或者文档中心。

需要哪些准备工作？

使用GitBook构建一个电子书其实很方便，从零开始搭建环境到浏览器上浏览可能只需要半个小时。前提是你需要了解以下技术：

• nodejs环境和npm
• Markdown语法

搭建nodejs环境

假设你是Windows用户，那么很简单，去nodejs官网下载最新版本的exe安装程序，点击下一步下一步就可以安装了，记得安装的时候勾选上添加到系统环境变量。如果忘记了添加了系统环境变量，那就手动配置一下，把nodejs.exe的路径添加到系统环境变量中的PATH中，这里就略过不提了。

假设你是MacOS或者Linux用户那就更简单了，因为基本上操作系统会自带nodejs环境。

检查nodejs环境

安装成功并且配置好nodejs的环境变量之后，打开终端(windows下为cmd)运行以下命令：

npm -v

• 如果显示一串版本信息的话说明nodejs环境OK。已经成功了一半，开不开心，刺不刺激？
• 如果显示npm命令找不到或者不是系统命令，请确认是否安装nodejs环境或者环境变量是否配置正确。

安装GitBook

上面提到GitBook是基于npm的插件，所以需要在npm环境中安装GitBook插件，我们运行以下命令：

npm install -g gitbook-cli

-g参数是global的意思，表示全局安装。

安装失败

因为国内网络防火墙的问题，npm安装GitBook很大概率会提示失败，这时候我们就需要配置公司或者VPN代理了。不过遇到这种问题的时候，作为开发者最常见的处理方式是使用淘宝网的npm代理进行安装。

npm配置淘宝网镜像

在终端命令行运行以下命令：

npm config set registry http://registry.npm.taobao.org/

设置好镜像之后，重新运行安装命令：

npm install -g gitbook-cli

等待片刻，安装完成，我们先查看一下GitBook的版本:

gitbook --version

查询Gitbook版本信息

新建一个工作文件夹

我们先来新建一个文件夹，比如叫做mywebsite:

cd foldername
mkdir mywebsite
cd mywebsite

其实windows环境下新建一个mywebsite的文件夹就可以了哇。

初始化GitBook项目

在我们上一步新建的mywebsite文件夹中执行以下命令：

gitbook init

执行以上命令后，你就可以看到在mywebsite文件夹下生成了两个md文件，一个叫做README.md，顾名思义，这个文件主要作为网站内容介绍的，另外一个SUMMARY.md文件是我们的核心文件，它决定了电子书的内容目录，我们的主要工作便是让这个文件显得层次分明，符合我们的阅读习惯。

初始化自动生成文件的日志如下：

初始化命令日志

编辑目录(SUMMARY.md)

GitBook只是一个npm插件，用于构建电子书的。它只是负责将不同的网页关联起来，其实这个插件的核心功能只有两个：目录导航和网站整体样式。那么电子书内容从哪里来？

上面我们提到，使用GitBook需要熟悉Markdown，因为我们需要用Markdown来编辑电子书的内容，而GitBook负责工程构建，实现不同内容的层次跳转，提供默认的css排版样式等等。

话不多说，我们先做一个简单的电子书，并且用GitBook构建工程，最终在浏览器上实现网页浏览。

设计电子书目录

打开SUMMARY.md文件，编辑内容，预览效果如下：

i电子书目录

以上内容中标题Summary和Introduction是init命令执行过程中默认写入的文件内容。下面三个链接表示对应了本地目录的三个文件。

按照当前目录自动创建文件

上面我们创建了三个链接，他们分别是：

• 我爱cpp
• java也不错
• php最好

这三个链接后面都对应了各自的md文件链接，但是现在实际上这些md文件是不存在的。通过以下命令我们可以再自动创建md文件：

gitbook init

有人可能注意到，我们之前运行过这个命令。是的，通常情况下这个命令需要运行很多次。这个命令有两个作用：

• 初始化一个GitBook项目，自动生成README.md和SUMMARY.md文件，一个用作内容介绍，一个用作编辑目录
• 根据目录内容（SUMMARY.md）自动创建不存在的文件

所以我们运行以上命令之后就会发现，多生成了三个md文件，文件名分别是：

• Ilovecpp.md
• javaisgood.md
• phpisbest.md

运行项目并在浏览器访问

上一步我们通过命令行自动创建了三个md文件，没有打开文件并修改内容，但是他们的开头都根据文件名写入了一行标题。你也可以随便加几行文字，编辑后保存。

运行电子书

激动人心的时刻到了呵呵，运行以下命令：

gitbook serve

gitboorun.png

gitbook默认运行在localhost下的4000端口号下，Windows系统下有可能出现端口号占用的情况，如果端口号冲突需要杀死4000端口对应的进程，如果嫌杀进程太麻烦的话，可以用以下命令来指定其他端口号：

gitbook serve --port 5000

在浏览器访问

打开浏览器，输入http://localhost:4000

显示效果如下：

ilovecpp.png javaisgood.png phpisbest.png

修改字体颜色的区域如图，点击左上角图标可以实现导航菜单的隐藏和显示功能：

fontstyle.png

好玩吧，后续继续关注呗。