Hexo+Github/Gitee搭建靜態網站博客

前言

Hexo是一個快速,簡單,功能強大的開源博客框架。
GitHub/Gitee Pages 是一個國內外靜態資源網站。
兩者結合可以搭建用戶自己的靜態網站。

搭建hexo

安裝node.js

根據操作系統,在官網下載對應的安裝包,地址爲:node.js
下載之後,安裝即可。

安裝git

根據操作系統,在官網下載對應的安裝包,地址爲:git
下載之後,安裝即可,具體安裝過程此處不作詳細介紹。

安裝hexo
npm install hexo-cli -g
初始化hexo

選擇需要安裝的項目目錄,執行以下命令:

hexo init [項目名稱,如hexo]

執行完成後,目錄截圖如下:

至此,hexo的本地安裝已完成。

搭建github/gitee(碼雲) pages

前言

由於本人需要將Hexo博客同時部署到 Github 和 gitee上 ,所以這裏介紹怎麼同時部署到這兩個網站的pages。
之所以選擇這兩個網站,是因爲國外用戶可以訪問 Github,而國內用戶可以訪問 gitee上。優化訪問速度。

修改配置文件

在站點根目錄下找到_config.yml文件,將裏邊的deploy節點修改成下邊的形式,其中repository等於username ,即

deploy:
  type: git
  repo: 
    github: [email protected]:[username]/[username].github.io.git,master
    gitee: [email protected]:[username]/[username].git,master

將上邊的倉庫url的{username}/{repository}改成自己的項目地址,這裏使用的是SSH協議的Git倉庫地址,即:

git@{domain}:{username}/{username}.git

推薦使用SSH協議的地址,免去每次pull/push輸入賬號密碼的繁瑣,也確保安全。

在 Github 和 Gitee 上各自創建一個倉庫

如果我們只是將項目部署到某一個代碼託管站點而已,那麼該項目倉庫的名字可以隨便起。
但是現在我們需要將項目同時部署到 Github 和 Gitee 上,那就不能隨意命名了。
我們需要採用特定的命名方式,才能正確將Hexo博客同時部署到這兩個站點上;否則很可能會導致只有博客的主頁能訪問到,而其他的路徑全部失效。

倉庫的命名

對於 Gitee,你可以選擇建立一個私人倉庫來部署自己的Hexo博客,不過和 Github 不同的地方在於:
Github 的倉庫名要命名爲: {username}.github.io
而 Coding.net 的倉庫名要命名爲:{username}
這裏的 username 指的是你在這兩個網站上的用戶名,只有以這種命名形式的倉庫,才能夠不通過子域名的形式來訪問我們的博客。
比如說,我的 Github 和Gitee 的賬號都是jack,那麼在部署博客成功後,我就可以通過下邊的url來訪問我的Hexo博客:

https://jack.github.io/
https://jack.gitee.io

如果將倉庫名命名爲其他的形式,比如:hexo-blog,那麼要訪問該博客,就需要輸入下邊的url:

https://jack.github.io/hexo-blog
https://jack.coding.me/hexo-blog

這裏的倉庫名hexo-blog就變成了子域名,於是問題就來了,對於存在子域名的Hexo博客,需要在站點配置文件裏配置url節點:

# URL
## If your site is put in a subdirectory, set url as 'http://yoursite.com/child' and root as '/child/'
url: http://yoursite.com
root: /
permalink: :year/:month/:day/:title/
permalink_defaults:

如果不配置這裏的url節點,會導致除了首頁以外的所有頁面都請求404
但是我們由於是同時部署在兩個網站上,其父域名是不一樣的,那麼這裏的url節點也就只能配置一個而犧牲另一個了;
但是如果你有自己的域名,就可以解決這個問題了:直接在這裏配置自己的域名就行了。

配置 SSH key

如果在Linux/Mac環境下,可以直接在terminal中執行key生成命令,Windows需要打開git bash,具體方法爲鼠標右鍵->選擇Git Bash。

創建RSA密鑰對

執行以下命令:
ssh-keygen -t rsa -b 4096 -C "[email protected]"
看到提示就按一次回車,在連續三次回車後,就表示創建成功了。
接着將~/.ssh目錄下將裏邊的id_rsa.pub文件裏的內容複製到剪切板。

Github 配置 SSH key

登陸 Github 的賬號:
進入 Settings 頁面
選擇 SSH and GPG keys
點擊 New SSH key
填寫 Title(用來給公鑰起一個名字,以便和其他的公鑰區分開來)
然後在 Key 裏將我們剛剛複製的公鑰粘貼進去
最後點擊 Add SSH key,這時候 GitHub 會要你輸入賬號密碼進行確認。

Gitee 配置 SSH key

登陸Gitee的賬號:
點擊用戶頭像->進入個人設置
選擇安全設置->SSH公鑰
選擇新增公鑰
填寫標題:公鑰標題key
填寫公鑰:把我們剛剛複製的公鑰粘貼到這裏
添加後輸入輸入賬號密碼進行確認

驗證 SSH 連接

使用Git Bash輸入:
ssh -T [email protected]
第一次連接時會問你是否繼續連接,輸入 yes 即可;
接下來驗證Gitee的ssh連接:
ssh -T [email protected]
同樣輸入 yes 即可。
至此,則github/gitee page搭建完成。

本地運行

啓動服務

在項目根目錄執行:hexo s
執行成功,則顯示如下:

打開http://localhost:4000 即可在本地訪問。

部署服務

安裝插件
$ npm install hexo-deployer-git --save
推送服務器
$ hexo deploy
訪問:

gitee的訪問:https://[gitee的用戶名].github.io
github的訪問:https://[github的用戶名].github.io

發佈了103 篇原創文章 · 獲贊 99 · 訪問量 45萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章