Hexo快速構建個人小站-Hexo初始化和將專案託管在Github(一)
背景交代
相信每個程式設計師都有自己做過個人網站,部落格之類的專案了,但是現在還在維護嗎?反正我前前後後做過2到3個了,維護一段時間後因為一些不可逆的原因(主要是懶)都沒有維護了,購買的一些域名和伺服器資訊也都過期了,最近玩了一下hexo,發現這個東西挺方便的,基本半個小時就可以搞完,並且如果 完全託管在github上基本就是0成本,用作學習記錄輸出是夠了。
1.依賴於nodejs安裝,安裝nodejs和npm
下載地址,可以對照電腦系統版本進行下載安裝:https://nodejs.org/en/download/
現在nodejs的安裝包內建了npm,所以下載安裝完成之後,nodejs和npm都會安裝好
檢查安裝是否成功
安裝成後會顯示出對應的版本資訊,由於我電腦之前就安裝過了,所以應該不是最新的版本
2.安裝hexo
安裝命令:
sudo npm i -g hexo
直接一步就安裝完成了,然後可以通過hexo -v檢視是否安裝成,成功安裝的話,會打印出上面截圖中的一些版本資訊
3.hexo初始化部落格專案
命令:
hexo init
初始化完成之後,看看hexo在資料夾給我生成了哪些檔案
如果你是一名前端或者nodejs開發者,相信對這些檔案再熟悉不過了,還是對上述幾個檔案簡單解釋一下:
-
node_modules:存放依賴包資訊
-
public:存放生成的頁面
-
scaffolds:存放生成文章的一些模板
-
source:存放用命令建立的各種文章
-
themes:存放部落格使用的主題
-
_config.yml:存放整個部落格的配置
-
db.json:存放source解析所得到的
-
package.json:存放專案所需模組專案的配置資訊
4.將生成的部落格專案跑起來
1、清除 hexo clean 2、生成 hexo g 3、啟動服務 hexo server
啟動完成後就可以按照提示,開啟 http://localhost:4000 來訪問我們在本地初始化好的部落格專案了
可以看到我們的專案已經成功跑起來了,成功的邁出了第一步,先暫且按耐住激動的心情,我們繼續!
5.在GitHub上建立倉庫用於託管部落格專案
開啟Github:https://github.com/PeyShine,新建一個倉庫,如圖
倉庫名稱需要配置為:個人名字.github.io,倉庫設定為公開,然後點選建立就可以
6.配置_config.yml
deploy: type: git repository: https://github.com/PeyShine/PeyShine.github.io.git branch: master
7.上傳專案
在此之前請先安裝一個外掛
npm install hexo-deployer-git --save
部署(上傳到GitHub)
hexo d 或者 hexo deploy
上傳過程中輸入了使用者名稱和密碼,如果提前配置好ssh也可以不用輸入
到Github上看一下,是否上傳成功
可以看到檔案都已經上傳成功了
8.成功訪問
通過域名“https://peyshine.github.io” 來訪問