想搭建一个 gitbook,可以导出到本地,用浏览器打开 index.html就可以打开整本书,然后可以点击左边的目录来选择阅读的那种,但是却踩了很多坑。
1、一开始安装 gitbook-cli 报错,找来找去发现是 nodejs 版本太高的问题,降到 node10 解决了安装问题;
2、后来又发现 gitbook build 出来的书籍点击目录不能跳转,根据网上的答案去修改 theme.js 文件,然后能点击了,但这样做有两个问题,问题一,每次 build 后都要去修改theme.js文件,麻烦,问题二,点击一级目录比如[Introduction](README.md),会跳转到所在文件夹下的文件目录,视觉上太不友好,不够完美。问题找来找去发现是gitbook3.0.0以上就开始不支持本地书籍目录跳转了,所以要用gitbook 2.6.9之类的来build。
3、但是用gitbook 2.6.9来build又报错。找来找去,发现是node版本没对应上导致,要切换到node6版本的环境下才能用gitbook 2.6.9 来 build。
4、到此build出来的静态书籍不用修改theme.js文件就能点击目录跳转,而且点击一级目录无异常,完美了。
gitbook是一个基于Node.js的命令行工具,所以要先安装Node.js,Node.js都会默认安装npm(node包管理工具)
0、安装nvm 【我的是Mac电脑】
nvm:node.js version management,nodejs版本管理器。可以很方便的安装、切换 nodejs 版本。
在安装gitbook-cli和gitbook build的时候需要用nvm切换nodejs版本。
安装nvm方法:
方法一【我用的这个】: brew install nvm , 根据提示手动添加东西到 ~/. bash_profile中,然后source ~/. bash_profile
。
方法二. 官方方法:
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.37.2/install.sh | bash
或wget -qO- https://raw.githubusercontent.com/nvm-sh/nvm/v0.37.2/install.sh | bash
;
然后添加以下到~/. bash_profile文件:export NVM_DIR="$([ -z "${XDG_CONFIG_HOME-}" ] && printf %s "${HOME}/.nvm" || printf %s "${XDG_CONFIG_HOME}/nvm")" [ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh" # This loads nvm
。
检查安装情况:
nvm -v // nvm版本号为 0.37.2
// 选用
nvm ls // 列出本地已安装好的nodejs版本
nvm use 6 // 全局切换版本,若提示还未安装nodejs v6,则install
nvm install 6 // 或者nvm install v10.23.0
nvm current // 查看当前使用的node版本
nvm ls-remote // 远程可以安装的所有node版本号
1、下载安装nodejs(安装后就可以用npm)
gitbook build书籍的时候,推荐用node6版本
,这样出来的书籍点击目录能跳转;
安装gitbook的时候,推荐用node10版本
,至于用node6会怎样没试过;
所以两个版本都安装下吧。
nvm ls // 查看本地是否有node6/10版本,若无则安装,如下
nvm install 6
nvm install 10
安装gitbook时候,node版本超过 V10版本 ,则会报错找不到方法,大概是:TypeError: cp.apply is not a function,不太清除了。
检查安装情况:
nvm ls
nvm current
node -v // v10.23.0
npm -v // 6.14.8
2、安装 gitbook-cli 【cli:命令行】
推荐用下面命令行安装,方便,注意切换nodejs版本到V10版本,也可试试用node6。也可参考 npm 中搜索gitbook,看如何安装。
nvm use 10 // 切换nodejs版本,方便顺利安装gitbook-cli
// npm search gitbook-cli
npm install -g gitbook-cli // -g全局,安装命令行版gitbook-cli
// npm install -g gitbook-cli@2.3.2 --save-dev //安装指定版本的命令行版gitbook-cli
gitbook -V //查看版本号,看是否安装成功
gitbook fetch 2.6.9 // 再安装2.6.9,用该版本build出来的书籍点击目录可以跳转
gitbook ls
【选读】查看远程有哪些gitbook版本可以安装
gitbook ls-remote
【选读】安装指定版本gitbook - 貌似要翻墙
gitbook fetch 2.6.9
【选读】查看gitbook当前版本:
gitbook -V
//CLI version: 2.3.2
//GitBook version: 3.2.3
【选读】查看本机gitbook都安装了哪些版本
gitbook ls
//* 3.2.3
// 2.6.9
// 2.6.7
【选读】卸载指定gitbook版本
gitbook uninstall 3.2.3
3、用npm下载安装gitbook插件
比如,生成目录的插件:gitbook-plugin-summary
,在 npm 中搜索并根据提示安装
npm i gitbook-plugin-summary --save
笔记文件夹下的book.json文件,没有就自己创建一个,添加如下代码:
{ "plugins": ["summary"] }
npm用法:
- npm搜索模块
*【npm search xxx】要翻墙,要么直接上www.npmjs.com 搜索; - npm安装模块
*【npm install xxx】利用 npm 安装xxx模块到当前命令行所在目录;
*【npm install -g xxx】利用npm安装全局模块xxx;
*【npm install xxx@3.21.2】npm安装指定版本的包; - 本地安装时将模块写入package.json中:
*【npm install xxx】安装但不写入package.json;
*【npm install xxx –save】 安装并写入package.json的”dependencies”中;
*【npm install xxx –save-dev】安装并写入package.json的”devDependencies”中。 - npm 删除模块
【npm uninstall xxx】删除xxx模块;
【npm uninstall -g xxx】删除全局模块xxx;
4、安装MarkDown编辑工具
安装markdown编辑工具 typora,或者用别的MarkDown编辑工具。
5、在文件夹中初始化
cd 到要创建gitbook的文件夹下
gitbook init
执行完后,如果文件夹里没有这两个文件,会自动生成:
README.md(书籍的介绍在这个文件里)
SUMMARY.md(书籍的目录结构在这里配置)。
6、SUMMARY.md
# Summary
* [Introduction](README.md)
* [Read](Read/README1.md)
* [1. 季节](季节/ReadMe2.md)
* [1.1 春](季节/section0.md)
* [1.2 夏](季节/section1.md)
* [2. 城市](城市/ReadMe3.md)
* [1.1 北京](城市/section0.md)
* [1.2 上海](城市/section1.md)
7、book.json : 配置文件
编辑 book.json 后,执行 gitbook install ./
安装。
注意"gitbook": "3.2.3"
这一对key/value,改成2.6.7或2.6.9,build的时候要跟 --gitbook=2.6.9 对应的上,否则gitbook版本对应不上,会build失败。
book.json参考:
{
"title": "opencv",
"output.name": "site",
"language": "zh-hans",
"gitbook": "2.6.9", // gitbook版本
"root": ".",
"plugins": [
"code",
"splitter",
"chapter-fold",
"-summary"
],
"pluginsConfig": {
"code": {
"copyButtons": true
}
}
}
{
"title": "Blankj's Glory",
"author": "Blankj",
"description": "select * from learn",
"language": "zh-hans",
"gitbook": "3.2.3", // gitbook版本可以修改
"styles": {
"website": "./styles/website.css"
},
"structure": {
"readme": "README.md"
},
"links": {
"sidebar": {
"我的狗窝": "https://blankj.com"
}
},
"plugins": [
"-sharing",
"splitter",
"expandable-chapters-small",
"anchors",
"github",
"github-buttons",
"donate",
"sharing-plus",
"anchor-navigation-ex",
"favicon"
],
"pluginsConfig": {
"github": {
"url": "https://github.com/Blankj"
},
"github-buttons": {
"buttons": [{
"user": "Blankj",
"repo": "glory",
"type": "star",
"size": "small",
"count": true
}
]
},
"donate": {
"alipay": "./source/images/donate.png",
"title": "",
"button": "赞赏",
"alipayText": " "
},
"sharing": {
"douban": false,
"facebook": false,
"google": false,
"hatenaBookmark": false,
"instapaper": false,
"line": false,
"linkedin": false,
"messenger": false,
"pocket": false,
"qq": false,
"qzone": false,
"stumbleupon": false,
"twitter": false,
"viber": false,
"vk": false,
"weibo": false,
"whatsapp": false,
"all": [
"google", "facebook", "weibo", "twitter",
"qq", "qzone", "linkedin", "pocket"
]
},
"anchor-navigation-ex": {
"showLevel": false
},
"favicon":{
"shortcut": "./source/images/favicon.jpg",
"bookmark": "./source/images/favicon.jpg",
"appleTouch": "./source/images/apple-touch-icon.jpg",
"appleTouchMore": {
"120x120": "./source/images/apple-touch-icon.jpg",
"180x180": "./source/images/apple-touch-icon.jpg"
}
}
}
}
8、gitbook init
SUMMARY.md改动后,需要 gitbook init,生成对应的文件
9、发布
gitbook serve
根据提示在浏览器中输入 http://localhost:4000
即可浏览
10、导出书籍
build时用 --gitbook=2.6.7或2.6.9,对应的nodejs切换到V6,这样生成书籍点击目录可以跳转。
// 对应gitbook2.6.7和2.6.9
nvm use 6
// 解决点击目录不能跳转
gitbook build --gitbook=2.6.9 书籍路径 输入路径
//gitbook build 书籍路径 输入路径
build结束后,nvm再切换回原来版本:
nvm use 10
11、 解决gitbook目录不能跳转的问题:
按照上面的走,应该不会有不能跳转的问题。
如果build用的gitbook版本大于3.0.0,生成的静态书籍,点击目录会无法跳转。因为从 3.0.0 版起, gitbook build 生成的 website 就不支持 local 打开了, 必需要 webserver 开启,实在要完全静态的, 就用 2.6.7或2.6.9 版吧( 在有些浏览器下估计不太完美 )
解决方案1:【推荐】gitbook build --gitbook=2.6.7或2.6.9,对应的 nodejs 切换到V6;
解决方案2:【不推荐】build时gitbook版本大于3.0.0的情况,修改theme.js代码 :打开theme.js文件,搜索if(m)for(n.handler&&,把m修改为false即可。每次 build 后都要修改,而且一级栏目点击后跳到文件夹层面,用户体验不好。