用 Hexo+Github 部屬靜態 Blog
2020-02-26 23:27:00 # Github # Hexo
778 words / 3-minute read
目錄 Table of contents
  1. 前言
  2. 安裝Hexo
  3. Commands
    1. 生成/架設/部署網站
      1. 生成靜態網頁
      2. 架設在Local端
      3. 部署到遠端(Github)
      4. 清除快取以及靜態檔案
    2. 寫作
      1. 建立文章
        1. Layout
      2. 發表草稿
  4. 遇到的問題集
  5. 第三方工具

前言

這篇文單純記錄用hexo在github上架設靜態網站遇到的問題以及一些指令和輔助工具，以防忘記。

另外這也是第一篇用Hexo Admin打的文章，作為嘗試。

安裝Hexo

其實不用多作介紹，網路上查的到很多教學，這邊就隨便放幾個:

甚至Hexo官網就有很齊全的教學了。

所以就不多作介紹了。

但這邊有個小問題當初卡了我一陣子，是語言和時區(timezone)到底要寫什麼才合法，
教學不是沒寫就是對岸的教學。總之是設定成這樣:

language: zh-tw
timezone: 'Asia/Taipei'

Commands

前提是該設定的都設定好了，如部署設定之類的。

生成/架設/部署網站

生成靜態網頁

hexo generate [-d] [-w]

或用縮寫

hexo g [-d] [-w]

使用-d參數會在生成後進行部署(deploy)。

架設在Local端

hexo server [-p] [-s] [-l]

或用縮寫

hexo s [-p] [-s] [-l]

便會啟動伺服器，預設是 http://localhost:4000/

參數不常用，有興趣就參考官方文件。

部署到遠端(Github)

hexo deploy [-g]

或用縮寫

hexo d [-g]

使用-g參數會在部署網站前先產生靜態檔案。

使用這項指令前要先設定好部署到github，之後只要輸入這個指令就會自動commit並push上去。如圖

會自動commit以及push至github上upload successful

清除快取以及靜態檔案

hexo clean

有些檔案更改後再次generate也不會修改，需要先清除才行。

寫作

建立文章

hexo new [layout] <title>

建立一篇新的文章。如果沒有設定 layout 的話，則會使用 _config.yml 中的 default_layout 設定代替。如果標題包含空格的話，請使用引號括起來。

文章檔案放在source/_posts裡面

Layout

Layout分為3種，post、draft、page。

  • post為一般文章存放區
  • draft為草稿區，之後會用publish指令將草稿移至post。
  • page為特別的頁面區，如tags、categories和about之類的頁面。

發表草稿

hexo publish [layout] <filename>

草稿檔案放在source/_drafts裡面。

遇到的問題集

  • Q1. 使用某些主題時(如我現在使用的melody主題)會發生打開網頁時跳出以下訊息

    extends includes/layout.pug block content include includes/recent-posts.pug include includes/pagination.pug

    A1. 你的環境缺少部分hexo套件，用以下指令安裝。(參考來源)

    npm install hexo-renderer-jade hexo-renderer-stylus --save or yarn add hexo-renderer-jade hexo-renderer-stylus

  • Q2. 部署上去的網站與local網站長的不同

    A2. 靜態文件沒有刷新，先hexo clean再部署一次

  • Q3. 將網站添加至google搜尋結果

    A3. 參考這篇教學

第三方工具

  • Disqus: 靜態網站留言版，大多數的hexo主題都有直接支援，不需要改網頁內容。小缺點是目前不知道為什麼不能設定成繁中。
  • Hexo Admin: Hexo線上編輯器，可以直接在網頁修改文章並發佈。
2020-02-26 23:27:00 # Github # Hexo
下一頁 Next