iT邦幫忙

第 12 屆 iThome 鐵人賽

DAY 18
0
Modern Web

Hugo 貼身打造個人部落格系列 第 18

Day 18. Hugo Site 自動部署 - 使用 Bash Shell Script

  • 分享至 

  • xImage
  •  

官方腳本

以下是官方提供部署到 GitHub 的腳本 (出處),筆者在此翻譯一下註解:

#!/bin/sh

# 若腳本任一行執行命令發生錯誤,導致 fail,則腳本停止往下執行
set -e

# 輸出提示文字:Deploying updates to GitHub...
printf "\033[0;32mDeploying updates to GitHub...\033[0m\n"

# 下 hugo 打包 public 資料夾
# 你可以變更此指令,帶入任何想追加的參數,例如指定佈景:`hugo -t <YOURTHEME>`
hugo 

# 進 public
cd public

# 把剛剛 `hugo` 渲染的結果,新增到 Changes to be committed 區,準備提交
git add .

# Commit 這次的異動
msg="rebuilding site $(date)"
if [ -n "$*" ]; then
	msg="$*"
fi
git commit -m "$msg"

# Push source and build repos.
git push origin master

補充說明一下,可以看出腳本中的 msg 是每次 git commit 會填入的訊息,該 commit msg 會長成這樣

請注意,若你需要標注每次執行 git push 的是誰,你必須先在本地設置 git config --global user.nameuser.email

$ git config --global user.name "YourName"
$ git config --global user.email your-name@example.com

自訂腳本 deploy.sh

筆者以原腳本為基礎做了些異動,原因如下:

  • 曾經發布過的舊文章、舊網址,不會因為你砍了檔案,就從版本控制中消失,你必須完整覆蓋掉他們,否則那些文章、頁面依然會存在。
  • 筆者追加了其它腳本,為的是將整個 hugo site 專案,一併執行提交本次異動,到另一個資源庫。
#!/bin/sh

##############################################
# 確認本地靜態資源包是否存在,是的話就移除
##############################################
set -e
# 移除上次可能留下的 original public repository
if [ -d "origin-public-repo" ]; then
  rm -rf origin-public-repo
fi
# 移除上次可能留下的 hugo 產生的 new public
if [ -d "public" ]; then
  rm -rf public
fi

##############################################
# Clone public origin project
##############################################
git clone
# 更名 littlebookboy.github.io 為 origin-public-repo
git@github.com:littlebookboy/littlebookboy.github.io.git origin-public-repo

##############################################
# Run `hugo` to Re-Build the project.
##############################################
hugo -t "tranquilpeak"

##############################################
# hugo 打包不會產生的檔案,但需被一同提交(保留的檔案)
##############################################
#   - .git
#   - CNAME
#   - README.md
cp -R ./origin-public-repo/.git ./public
cp ./origin-public-repo/CNAME ./public
cp ./origin-public-repo/README.md ./public
cd public

##############################################
# Add changes to git.
##############################################
git add .

##############################################
# Commit changes. (保留原腳本做法)
##############################################
msg="rebuilding site $(date)"
if [ -n "$*" ]; then
	msg="$*"
fi
git commit -s -m "$msg"

##############################################
# Push the /public source and build repos.
##############################################
# 使用 --force,just in case,
# 請確定你知道自己在幹嘛在移除註解,套用 force push
git push origin master # --force

##############################################
# 備份: 一併執行提交本次 ./myblog 異動到另一個資源庫
##############################################
cd ..
git add .
git commit -m "update blog"
git push origin master

執行腳本

本地跑腳本就可以一併提交 public (靜態網站) 與 blog (hugo-site) 兩個專案到 GitHub 上。

sh deploy.sh

CICD

若是想透過 git push trigger 網站自動部署去更新,簡單一點就是使用 Netlify 已經有內建。

若習慣使用如 GitHub Action、GitLab CI/CD、Travis Ci 等,自動幫你跑腳本,需另外在準備對應的 CI 腳本(劇本)。

參考連結


上一篇
Day 17. Hugo Site 部署 - Netlify
下一篇
Day 19. Hugo Content 使用圖源、壓縮與工具介紹
系列文
Hugo 貼身打造個人部落格30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言