換了字型的後後續

三、四天前 亖亖 寫了一封信給我，信中說他也是把部落格部署在 GitHub 上，可以正常使用 emfont 字型，希望我再試試，但後來還是失敗了。

在失敗之後我是這樣回答亖亖的：

有些人在網路環境很差的情況下，如果要看我的部落格還要花時間載入字體，好像會很不方便（我有時候也需要待在一些網路不好的地方，例如學校），所以我想說乾脆就別再放字型了，能快速載入可能比較重要。

原本想說就這樣算了，結果今天看到 JN 的部落格多了一頁 這個 ，就決定要找她¹把字型問題處理好了。

一開始在 local 測試完全沒問題，一上 GitHub 字型就完全不見，跟我在 前一篇 寫的一樣。後來在 GitHub 上的版本之後用開發人員模式檢查到有 error（只是當初我們都很好奇為什麼在 local 檢查不到問題）

後來回去找了在 GitHub 生成的 css，因為我用的 Hextra 主題 預設設定，import 被放在 css 檔案的後面，導致字型無法讀取

所以接下來我們要做什麼呢？就是覆寫主題設定啦！（準備看程式碼到發瘋（？

接下來我們從 11 點多，花了一個小時撞牆測試哪個部份有問題，一下看 GitHub 環境，一下看編譯器運作邏輯，還是看不出問題。

想說今天只有早上後面的一點零星時間可以用，今天應該是沒辦法解決了，結果 JN 就給我答案了：

因為你的 CI 有設 hugo 的環境變數，指定成 production²

然後 theme 裡面有寫到，如果是 production 的話，（theme 的 layout/_partials/head.html）跑的是 37~39 這幾行會把 3 個 CSS 的檔案壓成一個 minify 的 CSS，然後插到 html 的 header

如果最方便的話，應該就是把 custom 拉到最前面了。我試了一下有成功。

不過之後如果有再加東西到 custom.css 的話，就會加在最前面唷。之後如果有遇到問題的話要記得。

比較乾淨的作法，就會是另外新增一個 import.css 然後再把它加到 head.html 裡面了~~

調整了一下設定，真的成功了，謝謝 JN 幫我解決了花了我超多時間的問題！之前問過 AI，繞了一大圈都沒有答案。

這個就留給未來要用 Hextra 主題改字型的人啦，另外有問題的話，超推 JN 來幫你！去看看她的部落格吧！

JN 來幫你！： https://blog.giveanornot.com/help/