Hexo+Github搭建個人網頁

本文針對Mac

一、配置環境

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


二、創建網頁

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


三、配置Github

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


四、部署步驟每次部署的步驟,可按以下三步來進行。

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


五、hexo 一些常用命令:

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


這里有大量的主題列表使用方法里面都有詳細的介紹,我就不多說了。我這里有幾款個人認為不錯的主題,免去你們,一個一個的選了,歡迎吐槽我的審美,? 
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. 一個設計優雅的響應式主題 
Tinnypp - A clean, simple theme based on Tinny 
Writing - A small and simple hexo theme based on Light 
Yilia - Responsive and simple style 優雅簡潔響應式主題,我用得就是這個。 
Pacman voidy - A theme with dynamic tagcloud and dynamic snow


end sleep

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容