首先我們先創(chuàng)建一個筆記的目錄

可以在 SUMMARY.md 來添加本書目錄

# Summary

* [Introduction](README.md)

* [vue](./vue/index.md)

????* [什么是vue](./vue/1-vue.md)

????* [vue指令](./vue/2-vue.md)

然后添加一些內(nèi)容進來

添加一章，其中包括兩個小節(jié)，方括號中是標(biāo)題，小括號中是指向的文件，這里寫 .md 后綴即可，不寫 html 后綴。

瀏覽器中，看到目錄出來了。

把筆記保存到github中

我們在自己的github新建一個倉庫，然后把筆記上傳到github上，添加.gitignore文件添加github忽略文件，忽略_book文件夾，執(zhí)行以下命令上傳到github。

cd gitbook-note

git init

git add -A

git commit -m"msg"

git remote add origin https://github.com/sunshineyanghui/gitbook-note.git

git push -u origin master

現(xiàn)在瀏覽器中訪問https://github.com/sunshineyanghui/gitbook-note既可以看到筆記了。

編譯成html

為了部署方便，現(xiàn)在我們修改一下文件的結(jié)構(gòu)

cd gitbook-note

mkdir content

mv *.md content

mv vue content

現(xiàn)在運行g(shù)itbookserve會報錯，但是會自動創(chuàng)建 docs 文件夾，文件夾中的內(nèi)容，就是編譯后的輸出。

正確運行執(zhí)行下列命令

gitbook serve ./content ./docs

每次啟動的時候，都要敲長長的命令，很不方便，所以，我們就需要把命名簡短化，具體就是去寫成?npm 腳本。

把項目變成一個nodejs的項目

npm init -y

生成一個package.json文件，在package.json添加一下代碼

"scripts": {

????????"build": "gitbook build ./content ./docs"

},????????

然后執(zhí)行命令運行

npm run build

這樣 html 內(nèi)容被編譯好之后就會被保存到 docs 文件夾中。

部署到github pages

咱們來把 html 內(nèi)容部署到公網(wǎng)上，用到的是 github 的 pages 服務(wù)。

docs 文件夾 Push 到 github

運行 git add -A; git commit 操作，把 docs 文件夾保存到版本中，然后 git push 上傳。

瀏覽器中，到 https://github.com/sunshineyanghui/gitbook-note.git ，可以看到 docs/ 文件夾上傳完畢。

配置 pages 服務(wù)

到 倉庫配置頁面 到 Github Pages 一項下面。Source 一項設(shè)置為 master branch docs folder 意思就是 master 分支的 docs 文件夾。

等待幾分鐘，到 https://sunshineyanghui.github.io/gitbook-note/，可以看到本筆記上線了。