聚沙成塔,三步成书:GitBook极简入门教程

📖 本文简介

对于经常写作的工友来说,除了在各个平台上发布文章,其实还可以把自己的专栏整理成一本"在线书",分享到网上,方便系统阅读和沉淀内容。

市面上这类工具不少,比如 VitePress、Docusaurus 等等。但今天我想安利一个更轻量、也更易上手的工具 ------ GitBook

GitBook 插件丰富、界面友好,而且使用流程非常简单。只需 3 步,就能轻松把你的专栏整理上线:

  1. 安装环境
  2. 开始写书
  3. 发布

在动手之前你需要注册好 GitBook 和 GitHub 账号。

📀 安装环境

首先,你需要在电脑上安装好 Node.js,下载地址在官网:

nodejs.org/

建议不要一味追求最新版本,因为 Node 太新也可能没法跑 GitBook。你也可以借助 nvm(Node 版本管理工具)来切换不同版本的 Node,灵活又方便。

环境准备好后,打开终端(Terminal / CMD),输入以下命令全局安装 GitBook:

复制代码
npm install gitbook -g

安装完成后,可以用下面这个命令验证一下:

复制代码
gitbook -V

如果终端顺利输出了 GitBook 的版本号,就说明安装成功啦!

✍️ 开始写书

先找个文件夹放你的项目,我这边以《任天堂物语》为例,新建了一个 gitbook-nintendo-story 文件夹。

gitbook-nintendo-story 目录下,至少要创建两个文件:

  • README.md
  • SUMMARY.md

1. 写好 README.md

README.md 就像整本书的封面和简介,用一句话告诉读者你这本书讲什么。比如,我在 README.md 里写:

bash 复制代码
# 任天堂物语

🎴从花札到游戏机🎮,任天堂百年传奇,藏着无数人的童年光影。回头看看,那些游戏仍在发光。

这样打开就能让人一眼知道你这本「任天堂物语」的调性和内容。

2. 搭好 SUMMARY.md

SUMMARY.md 就是目录,用来告诉 GitBook 每章放在哪儿、怎么组织。格式其实很简单,就是列表加链接。例如:

markdown 复制代码
# Summary

* [专栏简介](README.md)
* 故事
	* [史前任天堂|在梦开始之前](./chapter/001史前任天堂,在梦开始之前/README.md)
	* [纸梦初成,任天堂的诞生](./chapter/002纸梦初成,任天堂的诞生/README.md)

提示:链接里可以引用子文件夹,比如 ./chapter/001_XXX/README.md,以此类推。

3. 创建章节目录

目录搞定后,就可以按照章节来写文章了。我在项目里新建了一个 chapter 文件夹,把第一章、第二章放进来,结构大概像这样:

css 复制代码
├── README.md
├── SUMMARY.md
├── chapter
│   ├── 001史前任天堂,在梦开始之前/README.md
│   └── 002纸梦初成,任天堂的诞生/README.md
└── chapter2
    └── README.md

每个章节都放一个单独的子文件夹,文件夹里放对应的 README.md 以及配图。这样目录清晰、管理也更方便。

好了,这样就完成了基本的文件布局,接下来就可以开始在各个章节的 README.md 里填内容啦!

4. 运行项目

完成前面的操作后,使用 gitbook init 命令初始化项目。

然后使用 gitbook serve 命令就可以把项目运行起来看看它长什么样子。

项目运行成功后,在浏览器访问 http://localhost:4000

🚀 发布你的在线书籍

到这里,你的项目已经准备就绪,就差把它发布到网上,让更多人看到了。

1. 把项目推送到 GitHub

  • 先在 GitHub 上新建一个空仓库。
  • 按照页面提示,复制对应的命令,把本地的 gitbook-nintendo-story(或你自己的项目文件夹)提交并推送到 GitHub。
  • 等待几秒钟,确认仓库里能看到你的所有文件。

2. 在 GitBook 上创建 Space 并同步 GitHub

  • 登录 GitBook 后,点击左侧 "Spaces" 旁边的 "+" 号,新建一个 Space。
  • 在创建时,选择 "Set up Git Sync" → "GitHub Sync"。最后记得选择"GitHub to GitBook",这样以后每次更新完你的书籍,上传到 GitHub 后,GitBook 也会自动把内容同步过来。
  • GitBook 会让你授权访问 GitHub,选择刚才创建的仓库,同步完成后,你就能在 GitBook 里看到项目内容了。

3. 预览并发布为 Docs Site

  • 在 GitBook 后台,选中刚刚同步过来的 Space。点击页面上方的 "Preview" 按钮,然后选择 "Publish as a docs site"。
  • 按照提示,创建一个新的 Site。
  • 创建完成后,回到 "Docs sites" 列表,选中新站点,点击右上角的 "Publish"。
  • 等待几秒,GitBook 会自动将你的网站公开,你就能访问到在线版的"任天堂物语"了。

4. 自定义二级域名(可选)

  • 如果你想让网址更好记,可以在 Site 设置里修改二级域名,比如 nintendo-story
  • 修改完毕后,保存并等待几分钟,新的域名就会生效,访问时会自动跳转到你刚发布好的文档站点。

完成以上步骤后,你的专栏就正式上线,任何人都可以通过你的 GitBook URL(或自定义域名)访问、浏览和分享你的作品啦!

rabbit-svip.gitbook.io/nintendo-st...


以上就是本文的全部内容了,如果本文对你有帮助的话,也请各位工友三连,转发给你的工友。

相关推荐
饮茶三千10 分钟前
五分钟!带你开发一个 VS Code 插件,实现状态栏文案轮播效果
前端
GIS之路11 分钟前
OpenLayers 地图投影转换
前端
用户48183772080311 分钟前
css grid实现流体布局
前端
Hanbox13 分钟前
探探React-找一个好看的组件库HeroUI(原NextUI)
前端
工呈士14 分钟前
Redux:不可变数据与纯函数的艺术
前端·react.js·面试
Tesla_king18 分钟前
用提示词写程序(3),VSCODE+Claude3.5+deepseek开发edge扩展插件V2
前端·edge
仔仔 v1.018 分钟前
解决Vue3+uni-app导航栏高亮自动同步方案
前端·javascript·vue.js
Mintopia22 分钟前
Three.js 形变动画(Morph Target Animation):让 3D 模型跳起变形之舞
前端·javascript·three.js
清幽竹客23 分钟前
vue-11(命名路由和命名视图)
前端·vue.js
sg_knight24 分钟前
Flutter嵌入式开发实战 ——从树莓派到智能家居控制面板,打造工业级交互终端
android·前端·flutter·ios·智能家居·跨平台