Hexo+Github搭建個(gè)人網(wǎng)頁(yè)

本文針對(duì)Mac

一、配置環(huán)境

  • 安裝Node(必須)
    作用:用來(lái)生成靜態(tài)頁(yè)面的 到Node.js官網(wǎng)下載相應(yīng)平臺(tái)的最新版本,一路安裝即可。
  • 安裝Git(必須)
    作用:把本地的hexo內(nèi)容提交到github上去. 安裝Xcode就自帶有Git,我就不多說(shuō)了。
  • 申請(qǐng)GitHub(必須)
    作用:是用來(lái)做博客的遠(yuǎn)程創(chuàng)庫(kù)、域名、服務(wù)器之類(lèi)的,怎么與本地hexo建立連接等下講。github賬號(hào)我也不再啰嗦了,沒(méi)有的話直接申請(qǐng)就行了,跟一般的注冊(cè)賬號(hào)差不多,SSH Keys,看你自己了,可以不配制,不配置的話以后每次對(duì)自己的博客有改動(dòng)提交的時(shí)候就要手動(dòng)輸入賬號(hào)密碼,配置了就不需要了,怎么配置我就不多說(shuō)了,網(wǎng)上有很多教程。
  • 正式安裝HEXO
    Node和Git都安裝好后,可執(zhí)行如下命令安裝hexo:
    $ sudo npm install -g hexo


二、創(chuàng)建網(wǎng)頁(yè)

  • 初始化
    創(chuàng)建一個(gè)文件夾,如:Blog,cd到Blog里執(zhí)行hexo init的。命令:
    hexo init
    好啦,至此,全部安裝工作已經(jīng)完成!
  • 生成靜態(tài)頁(yè)面
    繼續(xù)再Blog目錄下執(zhí)行如下命令,生成靜態(tài)頁(yè)面
    hexo generate (hexo g 也可以)
  • 本地啟動(dòng)
    啟動(dòng)本地服務(wù),進(jìn)行文章預(yù)覽調(diào)試,命令:
    hexo server
  • 驗(yàn)證網(wǎng)頁(yè)
    瀏覽器輸入http://localhost:4000
  • 如果有錯(cuò)誤
    ERROR Plugin load failed: hexo-server
    原因:
    Besides, utilities are separated into a standalone module. hexo.util is not reachable anymore.
    解決方法,執(zhí)行命令:
    sudo npm install hexo-server


三、配置Github

  • 建立Repository
    可以參考我之前的文章:http://www.itdecent.cn/p/31fb42ffb10c
    建立與你用戶(hù)名對(duì)應(yīng)的倉(cāng)庫(kù),倉(cāng)庫(kù)名必須為【your_user_name.github.io】,固定寫(xiě)法然后建立關(guān)聯(lián),我的Blog在本地/Users/taoyali/Blog,Blog是我之前建的東西也全在這里面,有:
    Blog 
    | 
    |-- _config.yml 
    |-- node_modules 
    |-- public 
    |-- source      
    |-- db.json 
    |-- package.json 
    |-- scaffolds 
    |-- themes         
    1.現(xiàn)在我們需要_config.yml文件,來(lái)建立關(guān)聯(lián),命令:
    vim _config.yml
    2.翻到最下面,改成我這樣子的,注意:: 后面要有空格
    deploy: type: git
    repository: https://github.com/taoyali/taoyali.github.io.git
    branch: master
  • 執(zhí)行如下命令才能使用git部署
    npm install hexo-deployer-git --save
    網(wǎng)上會(huì)有很多說(shuō)法,有的type是github, 還有repository 最后面的后綴也不一樣,是github.com.git,我也踩了很多坑,我現(xiàn)在的版本是hexo: 3.1.1,執(zhí)行命令hexo -vsersion就出來(lái)了,貌似3.0后全部改成我上面這種格式了。忘了說(shuō)了,我沒(méi)用SSH Keys如果你用了SSH Keys的話直接在github里復(fù)制SSH的就行了,總共就兩種協(xié)議,相信你懂的。
  • 然后,執(zhí)行配置命令:
    hexo deploy
     然后再瀏覽器中輸入http://taoyali.github.io/就行了,我的github的賬戶(hù)叫taoyali,把這個(gè)改成你github的賬戶(hù)名就行了


四、部署步驟每次部署的步驟,可按以下三步來(lái)進(jìn)行。

hexo clean 清空
hexo generate 初始化
hexo deploy 部署github (項(xiàng)目更改之后,使用這一個(gè)就行)


五、hexo 一些常用命令:

hexo new "postName" #新建文章
hexo new page "pageName" #新建頁(yè)面
hexo generate #生成靜態(tài)頁(yè)面至public目錄
hexo server #開(kāi)啟預(yù)覽訪問(wèn)端口(默認(rèn)端口4000,'ctrl + c'關(guān)閉server)
hexo deploy #將.deploy目錄部署到GitHub
hexo help # 查看幫助
hexo version #查看Hexo的版本


這里有大量的主題列表使用方法里面都有詳細(xì)的介紹,我就不多說(shuō)了。我這里有幾款個(gè)人認(rèn)為不錯(cuò)的主題,免去你們,一個(gè)一個(gè)的選了,歡迎吐槽我的審美,? 
Cover[https://github.com/daisygao/hexo-themes-cover] - A chic theme with facebook-like cover photo 
Oishi - A white theme based on Landscape plus and Writing. Sidebar - Another theme based on Light with a simple sidebar 
TKL - A responsive design theme for Hexo. 一個(gè)設(shè)計(jì)優(yōu)雅的響應(yīng)式主題 
Tinnypp - A clean, simple theme based on Tinny 
Writing - A small and simple hexo theme based on Light 
Yilia - Responsive and simple style 優(yōu)雅簡(jiǎn)潔響應(yīng)式主題,我用得就是這個(gè)。 
Pacman voidy - A theme with dynamic tagcloud and dynamic snow


end sleep

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容