玩遍部落格網站，我整理了 Hexo 及其流行的風格主題

於立發表於2021-02-02

搭建部落格網站是個人進入網際網路世界的最常見方式之一。伴隨著網站技術的發展，如何搭建部落格網站已經變得非常容易了。當然，你可以選擇諸如新浪部落格、CSDN、部落格園之類的大型網站，快速建立依賴於大平臺的個人部落格，不過這種方式的不足是言論受限太多、無法觸及網站底層技術。所以，對於想要自由發揮創意、又期望對網站擁有更多主動權的話，最好還是選擇自己去親手搭建一個網站。

本文來源：魚立說。本文連結：https://www.yulisay.com/d/kdhmp.html，支援微信瀏覽器開啟。

更多精彩文章，請移步魚立說個人網站翻看。歡迎欣賞，吐槽不足之處。

本主題將圍繞部落格網站的搭建流程、不同的部落格搭建技術及其流行的風格主題展開，整個系列由以下三個文章部分組成：

當下流行的部落格技術棧
Hexo 及其流行的風格主題
Hugo 及其流行的風格主題（後更）

Hexo 是一個快速、簡潔且高效的部落格框架。Hexo 使用 Markdown（或其他渲染引擎）解析文章，在幾秒內，即可利用靚麗的主題生成靜態網頁。其官網是：https://hexo.io。

安裝 Hexo

安裝 Hexo 相當簡單，但是需要先安裝下列應用程式即可：

Node.js >=12.0
Git

安裝 Node.js 和 Git 之後，全域性安裝 Hexo 的命令：npm install hexo-cli -g。

初始化一個名字為 hexo-blog 的專案：hexo init hexo-blog，此時將生成如下 Hexo 專案目錄：

.
├── _config.yml    # 網站的配置資訊
├── package.json   # 應用程式的資訊
├── public         # 公共資料夾，用於存放生成的站點檔案
├── scaffolds      # 模版資料夾
├── source         # 資原始檔夾，用來存放內容
└── themes         # 主題資料夾

快速操作 Hexo

檢視版本：hexo version 或者 hexo v

啟動服務：hexo server 或者 hexo s

新建一篇文章，比如：hexo new "Hello Hexo"

生成靜態檔案：hexo generate 或者 hexo g

部署網站：hexo deploy 或者 hexo d

清除快取檔案 (db.json) 和已生成的靜態檔案 (public)：hexo clean

正常啟動服務後，在瀏覽器開啟 http://localhost:4000/，將看到一個預設的主題網站，如圖：

圖：啟動 Hexo 服務

流行的 Hexo 主題

使用 Hexo 部落格時，我們最希望的是找到適合自己的一款主題，下面將圖文結合介紹一些流行的 Hexo 主題。此外，關於寫作的方法和 Hexo 主題修改，可以查閱本文參考中的 Hexo 官方文件，這裡不再贅述。

找到、安裝和配置 Hexo 主題

最好的搜尋方式是在 https://github.com/ 中，搜尋關鍵詞：hexo theme。或者使用搜尋引擎，搜尋：hexo theme site:github.com。

圖：在 Github 上搜尋 Hexo 主題

然後進入到專案目錄中，下載安裝我們需要的主題（theme-demo 只是一個示例資源，請注意替代為實際的資源）：

git clone https://github.com/theme-demo.git themes/theme-demo
cp -r themes/theme-demo/_source/* source

希望使用下載的主題，還需要在 _config.yml 中進行配置：

theme: theme-demo

接著，使用 hexo clean 清除快取，執行 hexo s 便可以看到下面這些 Hexo 風格主題的效果了。

Hexo 流行主題之 1：Maupassant

Maupassant 最初是由 Cho 大神為 Typecho 平臺設計開發的一套響應式模板，體積只有 20KB，在各種尺寸的裝置上表現出色。由於其簡潔大氣的風格受到許多使用者喜愛，目前也已經被移植到了多個平臺上。Github 地址：https://github.com/tufu9441/maupassant-hexo。

圖：Maupassant 風格主題