title: "優(yōu)麒麟2004 使用hugo+github搭建個人博客"
date: 2020-08-23T15:00:51+08:00
draft: false
1.安裝 Hugo
sudo apt install hugo
2.建立hugo項目
hugo new site [project-name]
例如我的站點名稱是 blog,創(chuàng)建命令如下:
hugo new site blog
3.添加主題
cd blog
git clone https://github.com/olOwOlo/hugo-theme-even themes/even
4.啟動hugo
hugo server
5.配置主題
為了個人使用,需要修改 config.tom 文件澜术,根據(jù)說明修改配置即可艺蝴。
我的主題配置文件
https://github.com/nusr/blog/blob/master/config.toml
進入 blog/themes/even 文件夾,會發(fā)現(xiàn)文件結構與新建的 Hugo 項目的文件結構幾乎是一樣的鸟废。這樣設置是為了用戶的配置可以覆蓋掉主題的配置猜敢。
比如我要自定義底部的顯示,hugo-theme-even 底部配置由 blog/themes/even/layouts/partials/footer.html 控制盒延。
為了覆蓋掉主題的配置缩擂,在項目根目錄下新建 blog/layouts/partials/footer.html 文件,填入自定義內容即可覆蓋掉主題配置添寺。其他文件的覆蓋是一樣的胯盯。
hugo-theme-even 使用了 Webpack 打包 js,css,并且文件名加入 hash 值,這種 css,js 是無法覆蓋的畦贸,不過 hugo-theme-even 配置中有覆蓋這種 css,js 的參數(shù),詳情參考我的文件配置
作者:nusr
鏈接:https://juejin.im/post/6844903831726194696
來源:掘金
6.添加新博客
添加新博客命令比較簡單楞捂,命令如下:
hugo new post/my-first-blog.md
復制代碼這個命令會使用模板創(chuàng)建文件薄坏,首先查找用戶的模板文件,沒有就會查找主題的模板文件寨闹。
hugo-theme-even 的模版文件 blog/themes/even/archetypes/default.md 比較復雜胶坠,新建 blog/archetypes/default.md 文件覆蓋掉即可。
我的模板配置如下:
---
title: "{{ replace .Name "-" " " | title }}"
date: {{ .Date }}
draft: false
---
draft 參數(shù)控制網站上該頁面是否顯示繁堡。設置為 false 或者去掉該參數(shù)才顯示沈善。 之前的內容會自動作為頁面摘要。
7.打包
為了部署到線上椭蹄,需要將 Markdown 文件打包成 HTML 文件闻牡。打包命令如下,even 是主題名:
hugo -t even
8.部署到 Github Pages
打包之后就是純 HTML 文件绳矩,理論上所有支持部署靜態(tài)頁面的網站都是支持的罩润。
我的部署命令如下,更多部署方式查看 gohugo.io/hosting-and…
#!/bin/bash
# 部署到 github pages 腳本
# 錯誤時終止腳本
set -e
# 刪除打包文件夾
rm -rf public
# 打包翼馆。even 是主題
hugo -t even # if using a theme, replace with `hugo -t <YOURTHEME>`
# 進入打包文件夾
cd public
# Add changes to git.
git init
git add -A
# Commit changes.
msg="building site `date`"
if [ $# -eq 1 ]
then msg="$1"
fi
git commit -m "$msg"
# 推送到githu
# nusr.github.io 只能使用 master分支
git push -f git@github.com:nusr/nusr.github.io.git master
# 回到原文件夾
cd ..
本文由博客一文多發(fā)平臺 OpenWrite 發(fā)布割以!