📖 本教程更新於 2021 年 07 月 20 日,教程的內容針對最新穩定版而更新(如果你是舊版,教程會有些出入,請留意)

🦋 Butterfly 已經更新到 3.8.2

你可以通過右下角的 按鈕切換為簡體顯示


hexo-theme-butterfly是基於 hexo-theme-melody 的基礎上進行開發的。

安裝

穩定版【建議】

在你的 Hexo 根目錄裏

1
git clone -b master https://github.com/jerryc127/hexo-theme-butterfly.git themes/butterfly

測試版

測試版可能存在 bug,追求穩定的請安裝穩定版

如果想要安裝比較新的 dev 分支,可以

1
git clone -b dev https://github.com/jerryc127/hexo-theme-butterfly.git themes/butterfly

升級方法:在主題目錄下,運行 git pull

穩定版【建議】

在你的 Hexo 根目錄裏

1
git clone -b master https://gitee.com/iamjerryw/hexo-theme-butterfly.git themes/butterfly

測試版

測試版可能存在Bugs,追求穩定的請安裝穩定版

如果想要安裝比較新的dev分支,可以

1
git clone -b dev https://gitee.com/iamjerryw/hexo-theme-butterfly.git themes/butterfly

升級方法:在主題目錄下,運行git pull

此方法只支持 Hexo 5.0.0 以上版本

通過 npm 安裝並不會在 themes 裏生成主題文件夾,而是在 node_modules 裏生成

在你的 Hexo 根目錄裏

1
npm i hexo-theme-butterfly

升級方法:在 Hexo 根目錄下,運行 npm update hexo-theme-butterfly

應用主題

修改 Hexo 根目錄下的 _config.yml,把主題改為butterfly

1
theme: butterfly

安裝插件

如果你沒有 pug 以及 stylus 的渲染器,請下載安裝:

1
npm install hexo-renderer-pug hexo-renderer-stylus --save

升級建議

升級完成後,請到 Github 的 Releases 界面 或者 文檔七 查看新版的更新內容。

裏面有標注 _config 文件的變更內容(如有),請根據實際情況更新你的配置內容。

為了減少升級主題後帶來的不便,請使用以下方法(建議,可以不做)。

此方法只支持 Hexo 5.0.0 以上版本,建議使用。

如果已經在 source/_data/ 創建了 butterfly.yml,請記得刪除掉。

在 hexo 的根目錄創建一個文件 _config.butterfly.yml,並把主題目錄的 _config.yml 内容複製到 _config.butterfly.yml 去。

以後只需要在 _config.butterfly.yml進行配置就行。

Hexo會自動合併主題中的_config.yml_config.butterfly.yml裏的配置,如果存在同名配置,會使用_config.butterfly.yml的配置,其優先度較高。

image-20200805191531090

從 3.3.0 開始,這種方法不再支持

為了減少升級主題後帶來的不便, Butterfly 使用了 data files 特性。

推薦把主題默認的配置文件_config.yml 複製到 Hexo 根目錄下的source/_data/ 目錄下,然後將文件名改為 butterfly.yml(如果source/_data/ 的目錄不存在就創建一個)。

注意,如果你創建了butterfly.yml, 它將會替換主題默認配置文件_config.yml裏的配置項 (不是合併而是替換,3.1.0開始將會是合併)

採用butterfly.yml的目的是,因為升級主題的時候,有可能會覆蓋到配置文件,以至於每次更新的時候都需要重新配置文件。如果使用butterfly.yml,就算主題目錄下的_config.yml被覆蓋,主題只會去butterfly.yml讀取配置。

由於主題在添加功能或者修復Bugs的情況下,可能會涉及到配置文件的修改。這時候,如果升級主題,需要把新增加的配置添加到butterfly.yml去,不然很大機會會出現報錯。( 3.1.0 之後,應該不會出現這種情況)

📑 Butterfly 安裝文檔(二) 主題頁面