- Published on
Hugo - Static Site Generator
- Authors
- Name
- Cypress Kuo
- @cypresskuo
Hugo 是用 Go 語言開發的靜態網站生成器。優點是建置速度極快,使用上指令簡單,再加上主題眾多,可以輕鬆快速建立自己的網站,是一個非常方便又省時的工具。
以下簡單介紹如何使用 Hugo 建立自己的 Blog
安裝 Hugo
使用 Homebrew 安裝 Hugo。
如果你是 Mac 以外的使用者,請看 官方文件 來進行安裝
brew install hugo
初始化
建一個新的專案,這裡就先用 my-blog
示範。
hugo new site my-blog
cd my-blog
加入主題
檢查一下有沒有 themes
這個資料夾,如果沒有需要先建立。
mkdir -p themes
選一個自己喜歡的主題 Hugo Themes,這裡用 hugo-theme-nix 這個主題示範
cd themes && git clone https://github.com/LordMathis/hugo-theme-nix
加入範例設定檔與文章
接著將主題內的範例設定檔和文章複製一份到根目錄下。
cp -r themes/hugo-theme-nix/exampleSite/* ./
這個步驟主要是複製主題內 exampleSite 下的設定檔
config.toml
跟文章post
,快速建立網站。 不同的主題使用的設定檔多少會有些差異,詳情請看各主題的使用文件
建立測試站
啟動本地端 dev 模式。
hugo server -D
使用瀏覽器開啟 http://localhost:1313/
就能看到測試站了。
產出靜態檔案
hugo -D
在根目錄底下會產生出 public
,直接將整個資料夾丟到網路上的空間就大功告成了!
另外提一下,GitHub 不支援直接建置 Hugo 的專案,所以需要再把 public 目錄 push 到 GitHub 上的專案。
心得後記
Hugo 真的很好上手,自建一個 Blog 網站沒花多少時間。大部份的時間反而都花在找主題跟 Firebase 和 DNS 設定上。下次有機會再來談談如何把剛剛蓋好的網站丟上 Firebase 吧。