Mac电脑GitBook搭建

想搭建一个 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 | bashwget -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 后都要修改,而且一级栏目点击后跳到文件夹层面,用户体验不好。


参考:
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容