前言

現(xiàn)在市面上已經(jīng)有許多博客了，比如 CSDN、掘金、博客園、簡書等等。我們可以直接在上面發(fā)表內(nèi)容，而且交互比較人性化，而且也能被搜索引擎檢索到。但是總歸是別人的平臺，經(jīng)常會受限，因此我們就希望能有自己的博客。之前也嘗試過搭建過不同的博客類型，折騰了不少工作，最終決定定型，采用 Hexo + Github Pages 的方式。今天就帶大家一起來搭建自己的博客。由于是采用 Hexo + Github Pages 的方式，所以都是免費的，只是需要有一定的動手能力！

Hexo 簡介

Hexo 是一個快速、簡潔且高效的靜態(tài)博客框架。Hexo 使用 Markdown（或其他渲染引擎）解析文章，在幾秒內(nèi)，即可利用靚麗的主題生成靜態(tài)網(wǎng)頁。我們只需要通過 Markdown 語法寫好自己的博客內(nèi)容，然后通過簡單的命令就能夠?qū)⑸傻木W(wǎng)頁上傳到 Github，然后大家都可以來訪問你的網(wǎng)頁了。既方便了自己，也給了自己一個展示自己成果的平臺，是不是一舉兩得。

搭建步驟

搭建之前，需要做一些準備工作，首先需要確保你的電腦上已經(jīng)上安裝好了 Git 和 Node.Js，然后才能開始安裝 Hexo，那么首先我們先來看看如何準備這這些環(huán)境。

Git

安裝

Window：下載并安裝

macOS：下載并安裝

Linux（Debian，Ubuntu）：sudo apt-get install git-core

Linux（Fedora、RedHat、CentOS）：sudo yum install git-core

設置

安裝成功后，將 git 與 GitHub 賬號綁定，右鍵打開 Git Bash，然后設置配置信息：

# 配置用戶名和郵箱 git config --global user.name "github 用戶名" git config --global user.email "github 注冊郵箱"

比如我的配置就是：

git config --global user.name "cunyu1943" git config --global user.email "747731461@qq.com"

接著生成 ssh 密鑰文件，輸入如下命令后直接三次回車即可，一般不需要設置密碼；

# 生成 ssh 密鑰 ssh-keygen -t rsa -C "github 注冊郵箱"

我生成秘鑰的命令：

ssh-keygen -t rsa -C "747731461@qq.com"

一般執(zhí)行上述命令之后，會生成 id_rsa 和 id_rsa.pub 兩個文件，前者是我們私有的，而后者則是對外開放的。接著找到生成的 .ssh 的文件夾中的 id_rsa.pub 密鑰，將內(nèi)容復制；

然后打開 GitHub-Settings-Keys 頁面，創(chuàng)建一個新的 SSH key，填寫 Title 和 Key，Title 可以隨意，而 Key 的內(nèi)容則是我們剛才復制的 id_rsa.pub 中的內(nèi)容，最后點擊 Add SSH key 即可；

Node.Js 安裝

安裝

去官網(wǎng)下載最新的穩(wěn)定版 Node.JS ，一般推薦 64 位（大家應該現(xiàn)在用的電腦基本都是 64 位的吧），安裝的話很簡單，基本就是下一步下一步點擊就好了。如果還是不知道如何安裝，可以參考我的另一篇博客：Windows 下 Node.js 的安裝（多圖版）

驗證

安裝完成后，要查看我們是否安裝成功，可以打開命令提示符（Win + R），輸入 cmd 打開控制臺，輸入如下命令，如果出現(xiàn)對應版本號，說明安裝成功了；

node -v npm -v

設置

由于下載包是從國外服務器，所以速度較慢，因此我們推薦用阿里的國內(nèi)鏡像進行設置；

npm config set registry https://registry.npm.taobao.org

Hexo 安裝

在你的硬盤上找個地兒，用來存放你的博客文件，比如我的就在 D:personalFiles/github/blog，這個文件夾你可以根據(jù)自己的喜好來設置。然后從命令臺進入當前文件夾，接下來就是安裝過程了；

首先安裝 Hexo

npm i hexo-cli -g

新建一個文件夾用于存放你的博客，比如我的是 blog，然后進入該文件夾，并用如下命令進行初始化并安裝必備組件；

hexo init . npm install

初始化后，目錄結(jié)構(gòu)如下；

. ├── _config.yml # 網(wǎng)站配置信息 ├── package.json # 應用程序信息 ├── scaffolds # 模板文件夾 ├── source # 存放用戶資源 | ├── _drafts | └── _posts └── themes # 主題文件夾

然后輸入如下命令，然后在瀏覽器中打開 http://localhost:4000；

# 新建博客 hexo new "博客名" # 生成靜態(tài)網(wǎng)頁 hexo g # 打開本地服務器 hexo s

然后就可以看到如下的界面，不過我的是經(jīng)過修改過的，所以和你的會不一樣。

Github 個人倉庫

完成上面的步驟之后，我們就能在本地進行預覽了，不過我們?nèi)绻胍l(fā)布到網(wǎng)上供別人看的話，那就得利用 Github Pages 的功能了，下邊就來介紹如何結(jié)合 Hexo + Github Pages ，將我們的博客推送到網(wǎng)上去，方便大家在任何地方訪問！

首先你得有個 GitHub 賬號，如果沒有的，請出門 右轉(zhuǎn) 先去注冊個賬號；

有了賬號之后，新建一個倉庫，而且得確保你的倉庫是 public，你要搞個 private，誰能訪問的了？？？同時，倉庫名一定要是：

用戶名.github.io

用戶名.github.io

用戶名.github.io

這個用戶名建議不要太復雜，但是又要能體現(xiàn)你個人特點，因為后續(xù)讓別人訪問你的博客時，就要通過 https://用戶名.github.io 這個域名來訪問。比如我的用戶名是 cunyu1943，所以我的倉庫就是 cunyu1943.github.io：

部署到 Github

完成上面的步驟后，你應該能在本地進行預覽了，接下來就是推送網(wǎng)站到 Github Pages 了，然后我們就能被其他人訪問了。

只需要在我們剛才的博客根目錄中的站點配置文件 _config.yml ，設置為你的個人倉庫名即可：

完成上述步驟之后，主要使用如下命令，就能將我們本地的內(nèi)容推送到遠程 GitHub 倉庫了，然后在瀏覽器中訪問：

https://用戶名.github.io

比如我的博客 村雨遙的博客；

hexo clean hexo g hexo d

Gitee 個人倉庫

上面說完部署到 Github，接下來就說說怎么部署到 Gitee，老規(guī)矩，首先你得需要一個 Gitee 賬號，如果沒有的，出門 右轉(zhuǎn) 先去注冊個賬號。

然后新建一個倉庫，同樣有幾點需要注意的：

保證你的倉庫是 public；

倉庫名是 你的用戶名，這一點和 Github 略有不同，不需要是 用戶名.gitee.io；

比如我的用戶名是 cunyu1943，所以我的倉庫名就是 cunyu1943。

部署到 Gitee

完成上面的步驟后，你應該能在本地進行預覽了，接下來就是推送網(wǎng)站到 Gitee Pages 了，然后我們就能被其他人訪問了。這里需要注意的是，Gitee Pages 不像 Github Pages 會自動更新，它需要你每次推送后，去更新一下，如果想要自動更新，就需要開通 Gitee 的會員。

然后需要在我們剛才的博客根目錄中的站點配置文件 _config.yml ，設置為你的個人倉庫名即可：

完成上述步驟之后，主要使用如下命令，就能將我們本地的內(nèi)容推送到遠程 Gitee 倉庫了，去手動更新 Gitee Pages 后，然后在瀏覽器中訪問：

https://用戶名.gitee.io

如何寫新博客并推送到遠程

通過上面的步驟后，你的博客應該就已經(jīng)搭建成功，而且能通過 https://用戶名.github.io 的方式進行訪問了。接下來如果我們要發(fā)一篇新的博客內(nèi)容，又應該怎么辦呢？接下來就詳細講一下如何操作。

首先進入博客所在文件夾，然后右鍵進入控制臺，用如下命令進行創(chuàng)建新的文章；

hexo n "博客標題名"

接著在 blog/source/_posts 目錄下應該就會有創(chuàng)建好的以文章標題名命名的 Markdown 文件；

接著打開該文件，編寫你自己想要的內(nèi)容即可；

接著在控制臺使用如下命令，將其推送到遠程 GitHub 倉庫，等過一會兒之后，訪問即可看到剛才推送的新文章了！

hexo g hexo d

如何綁定自定義域名

通過 用戶名.github.io 的方式來訪問總歸是有些不方便，如果我們需要自己的個性域名，又應該如何設置呢？那么在此之前，你需要有一個已經(jīng)備案好的域名，如果沒有的話，請到阿里云、騰訊云等場商購買自己的域名，然后通過該平臺備案，然后添加兩條解析記錄，以我的騰訊云為例：

備好案并設置解析之后，在 Github 的博客項目中，依次點擊 Settings->Pages，然后在 Custom domain 添加你的域名即可，最后 Save 即可，此時你的博客根目錄下應該會多一個 CNAME 的文件，然后你就可以通過自己的域名來訪問你的博客了。

當然，有時候可能經(jīng)過上面的設置后，博客根目錄下不會出現(xiàn)名為 CNAME 的文件，如果沒有，我們可以通過在本地博客 /source 目錄下手動建立一個 CNAME 文件（無后綴），然后把你的域名填進去并保存，最后依次執(zhí)行如下命令將設置上傳到 Github 即可 ~

hexo g hexo d

比如我的域名為 cunyu1943.site，通過設置之后，我們就可以通過 https://cunyu1943.site 來訪問我的博客了。

美化

經(jīng)過上面的設置之后，我們只是得到了一個簡單地博客，如果你也想讓你的博客像我的一樣酷（zhuang）炫（bi），就要用到主題了，我采用的主題是 hexo-theme-matery，一個基于材料設計和響應式設計而成的主題，而且關于如何設置它也有十分詳細的文檔，如果存在不懂得問題，還可以及時提交 issue，作者回復也十分及時。

如果你不想過于折騰，那么你完成上面的步驟之后，也可以直接采用我的博客源代碼，然后把里邊的個人配置改一下就 ok 了，我的博客源碼地址：hexo-theme-matery-personal

大家直接下載下來，然后把 node_modules.zip 進行解壓，然后修改其中的部分配置（也就是你的 Github、網(wǎng)名啥的呀個人信息），主要是修改根目錄下的 _config.yml 和 _config.hexo-theme-matery.yml，然后就可以直接寫博客了。當然，前提是你把環(huán)境啥的都搭建好了。

PS：我對于配置文件中的某些關鍵信息進行了隱藏，比如 gitalk、gitment、Valine、baiduAnalytics 等，這些需要你自己去注冊并獲取自己的信息，請記得修改，否則可能導致失敗。

總結(jié)

至此，我們的博客就搭建完成了，是不是很簡單，趕緊去試試吧！

對于文中不清楚的地方，歡迎留言，我會在看到的第一時間回復你！

總結(jié)

以上是生活随笔為你收集整理的【效率为王】超详细 Hexo + Github Pages 博客搭建教程的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。