通過 hexo 生成靜態博客
背景
在對比了很多博客網站以后，我決定開始慢慢遷移我的文章，以后有時間的話還會搭建自己的網站，目前主流的靜態博客生成器有三個： jekyll, hexo, hugo.
靜態博客生成器是一種將 文檔（主流是markdown 格式）生成靜態網站頁面文件的工具；當我們再將生成的結果放到page服務上，就可以變為靜態博客。
接下來我們就圍繞 hexo 和博客搭建來展開，如果你具有前端編程能力我推薦你一開始就是用 hugo 來搭建自己的博客，如果你不熟悉前端知識建議你使用 hexo 實現，因為 hexo 的優勢就是有很多現成的插件, 而且可選的主題樣式比較多。唯一的缺點就是生成的速度可能會比較慢，但半個小時內的速度對於我本人是可以接受的。
host平台 ：Ubuntu 16.04
步驟
我們使用 Hexo 只需要如下幾個步驟就可以實現一個最基本的網站，甚至都不需要自定義。接下來先從大概搭建步驟上簡要說明過程：
安裝 Hexo
Hexo 安裝的前提條件 安裝 Node.js 和 npm 環境：
npm install -g hexo-cli
npm install -g hexo-server
如果遇到nodejs版本太低會遇到下面的問題：
$ hexo -version
/usr/local/lib/node_modules/hexo-cli/lib/hexo.js:15
function entry(cwd = process.cwd(), args) {
^
SyntaxError: Unexpected token =
at exports.runInThisContext (vm.js:53:16)
at Module._compile (module.js:374:25)
at Object.Module._extensions..js (module.js:417:10)
at Module.load (module.js:344:32)
at Function.Module._load (module.js:301:12)
at Module.require (module.js:354:17)
at require (internal/module.js:12:17)
at Object.<anonymous> (/usr/local/lib/node_modules/hexo-cli/bin/hexo:5:1)
at Module._compile (module.js:410:26)
at Object.Module._extensions..js (module.js:417:10)
$ nodejs --version
v4.2.6
部署
安裝 Hexo 完成后，請執行下列命令，Hexo 將會在指定文件夾中新建所需要的文件。
$ hexo init <folder>
$ cd <folder>
$ npm install
新建完成后，指定文件夾的目錄如下：
.
├── _config.yml
├── package.json
├── scaffolds
├── source
| ├── _drafts
| └── _posts
└── themes
_config.yml
網站的 配置 信息，您可以在此配置大部分的參數。
package.json
應用程序的信息。EJS, Stylus 和 Markdown renderer 已默認安裝，您可以自由移除。
package.json
{
"name": "hexo-site",
"version": "0.0.0",
"private": true,
"hexo": {
"version": ""
},
"dependencies": {
"hexo": "^3.8.0",
"hexo-generator-archive": "^0.1.5",
"hexo-generator-category": "^0.1.3",
"hexo-generator-index": "^0.2.1",
"hexo-generator-tag": "^0.2.0",
"hexo-renderer-ejs": "^0.3.1",
"hexo-renderer-stylus": "^0.3.3",
"hexo-renderer-marked": "^0.3.2",
"hexo-server": "^0.3.3"
}
}
scaffolds
模版 文件夾。當您新建文章時，Hexo 會根據 scaffold 來建立文件。
Hexo的模板是指在新建的文章文件中默認填充的內容。例如，如果您修改scaffold/post.md中的Front-matter內容，那么每次新建一篇文章時都會包含這個修改。
source
資源文件夾是存放用戶資源的地方。除 _posts 文件夾之外，開頭命名為 _ (下划線)的文件 / 文件夾和隱藏的文件將會被忽略。Markdown 和 HTML 文件會被解析並放到 public 文件夾，而其他文件會被拷貝過去。
themes
主題 文件夾。Hexo 會根據主題來生成靜態頁面
創建文章
創建一篇新的文章
hexo new "my-first-post"
生成靜態文件
使用以下命令，成功以后在public目錄看到生成的靜態文件內容，只需要將該內容同步到服務器即可。
hexo g
測試
為了方便測試，hexo提供了本地服務，在當前目錄下使用以下命令
hexo server
然后在 瀏覽器中打開http://localhost:4000，即可看到效果
安裝新的主題
上hexo | them 可以選擇自己喜歡的主題。這里以“NexT”為例。
下載
git clone https://github.com/theme-next/hexo-theme-next.git
下載以后，放到 theme文件夾，改名為next
修改配置
修改_config.yml,將theme改為 next
重新生成
hexo clean && hexo d -g
添加新的頁面
修改_config.yml，添加
# ---------------------------------------------------------------
# Menu Settings
# ---------------------------------------------------------------
# When running the site in a subdirectory (e.g. domain.tld/blog), remove the leading slash from link value (/archives -> archives).
# Usage: `Key: /link/ || icon`
# Key is the name of menu item. If the translation for this item is available, the translated text will be loaded, otherwise the Key name will be used. Key is case-senstive.
# Value before `||` delimiter is the target link.
# Value after `||` delimiter is the name of FontAwesome icon. If icon (with or without delimiter) is not specified, question icon will be loaded.
# External url should start with http:// or https://
menu:
home: / || home
about: /about/ || user
tags: /tags/ || tags
categories: /categories/ || th
archives: /archives/ || archive
#schedule: /schedule/ || calendar
#sitemap: /sitemap.xml || sitemap
#commonweal: /404/ || heartbeat
輸入以下命令：
hexo new page "about" &&
hexo new page "tags" &&
hexo new page "categories"
打開各頁面對應的index.md文件，編輯如下內容，title和date是默認生成的，增加type即可：
type: "about"、type: "tags"、type: "categories"
重新部署
hexo clean && hexo d -g
測試
hexo server