HugoのTheme Janeをアップデートする

はじめに

長らく更新していなかったHugoのThemeを久しぶりに更新してみる。

動機

3年前に構築して以来、一切アップデートをしてこなかったので…

環境

Windows 10 Professional
$ hugo version
Hugo Static Site Generator v0.62.0-6608F155 windows/amd64 BuildDate: 2019-12-23T10:26:18Z

Janeのアップデート

1. JaneのGitHubページに移動する。

https://github.com/xianmin/hugo-theme-jane

上記の Quick Startの手順を参考に進める。

2. JaneのテーマをGit Cloneし、コピーする。

git clone https://github.com/xianmin/hugo-theme-jane.git --depth=1 themes/jane

おそらく既にあるので、エラーになるはず…。

$ git clone https://github.com/xianmin/hugo-theme-jane.git --depth=1 themes/jane
fatal: destination path 'themes/jane' already exists and is not an empty directory.

なので、 themeJane を削除する。

rm -fr themes/jane

その後、git cloneする。

git clone https://github.com/xianmin/hugo-theme-jane.git --depth=1 themes/jane

$ git clone https://github.com/xianmin/hugo-theme-jane.git --depth=1 themes/jane
Cloning into 'themes/jane'...
remote: Enumerating objects: 250, done.
remote: Counting objects: 100% (250/250), done.
remote: Compressing objects: 100% (226/226), done.
remote: Total 250 (delta 17), reused 137 (delta 3), pack-reused 0
Receiving objects: 100% (250/250), 621.11 KiB | 10.18 MiB/s, done.
Resolving deltas: 100% (17/17), done.

OK

3. 起動

$ hugo server -D
Building sites … ERROR 2023/02/13 15:31:42 Transformation failed: TOCSS: failed to transform "sass/jane.scss" (text/x-scss): this feature is not available in your current Hugo version, see https://goo.gl/YMrWcn for more information

ん? どうやら Hugoのバージョンが古いようで起動できないみたい。 ここからは Hugoのバージョンを上げてみる。

Hugoのバージョンアップ

1. chocolatelyでアップデートする。

もはや記憶になかったが chocolately で入れていたので、 update をする。

C:\WINDOWS\system32>choco update hugo
Chocolatey v0.10.11

DEPRECATION NOTICE - choco update is deprecated and will be removed or
 replaced in version 1.0.0 with something that performs the functions
 of updating package indexes. Please use `choco upgrade` instead.
Upgrading the following packages:
hugo
By upgrading you accept licenses for the packages.

You have hugo v0.62.0 installed. Version 0.110.0 is available based on your source(s).
Progress: Downloading hugo 0.110.0... 100%

hugo v0.110.0 [Approved]
hugo package files upgrade completed. Performing other installation steps.
The package hugo wants to run 'chocolateyInstall.ps1'.
Note: If you don't run this script, the installation will fail.
Note: To confirm automatically next time, use '-y' or consider:
choco feature enable -n allowGlobalConfirmation
Do you want to run the script?([Y]es/[N]o/[P]rint): Y
$ hugo version
hugo v0.110.0-e32a493b7826d02763c3b79623952e625402b168 windows/amd64 BuildDate=2023-01-17T12:16:09Z VendorInfo=gohugoio

できました!

2. 改めてサーバ起動

hugo server -D

hugo v0.110.0-e32a493b7826d02763c3b79623952e625402b168 windows/amd64 BuildDate=2023-01-17T12:16:09Z VendorInfo=gohugoio
Error: Error building site: TOCSS: failed to transform "sass/jane.scss" (text/x-scss). Check your Hugo installation; you need the extended version to build SCSS/SASS with transpiler set to 'libsass'.: this feature is not available in your current Hugo version, see https://goo.gl/YMrWcn for more information

しかしエラー 調べてみると、 HugoにExtendedバージョンが有ることを知った。 どうやらこれを使わないと、 Sassが使えないらしくエラーになるらしい?

https://gohugo.io/installation/windows/

3. Hugoの拡張版を入れる

choco install hugo-extended

C:\WINDOWS\system32>choco install hugo-extended
Chocolatey v0.10.11
Installing the following packages:
hugo-extended
By installing you accept licenses for the packages.
Progress: Downloading hugo-extended 0.110.0... 100%

hugo-extended v0.110.0 [Approved]
hugo-extended package files install completed. Performing other installation steps.
The package hugo-extended wants to run 'chocolateyInstall.ps1'.
Note: If you don't run this script, the installation will fail.
Note: To confirm automatically next time, use '-y' or consider:
choco feature enable -n allowGlobalConfirmation
Do you want to run the script?([Y]es/[N]o/[P]rint): Y

Extracting 64-bit C:\ProgramData\chocolatey\lib\hugo-extended\tools\hugo_extended_0.110.0_windows-amd64.zip to C:\ProgramData\chocolatey\lib\hugo-extended\tools...
C:\ProgramData\chocolatey\lib\hugo-extended\tools
Environment Vars (like PATH) have changed. Close/reopen your shell to
 see the changes (or in powershell/cmd.exe just type `refreshenv`).
 ShimGen has successfully created a shim for hugo.exe
 The install of hugo-extended was successful.
  Software installed to 'C:\ProgramData\chocolatey\lib\hugo-extended\tools'
$ hugo version
hugo v0.110.0-e32a493b7826d02763c3b79623952e625402b168+extended windows/amd64 BuildDate=2023-01-17T12:16:09Z VendorInfo=gohugoio
hugo server -D

$ hugo server -D
Start building sites … 
hugo v0.110.0-e32a493b7826d02763c3b79623952e625402b168+extended windows/amd64 BuildDate=2023-01-17T12:16:09Z VendorInfo=gohugoio

                   | EN  | JA   
-------------------+-----+------
  Pages            |   8 | 139
  Paginator pages  |   0 |  28
  Non-page files   |   0 |   0
  Static files     | 202 | 202
  Processed images |   0 |   0
  Aliases          |   2 |  38
  Sitemaps         |   2 |   1
  Cleaned          |   0 |   0

Built in 644 ms
Watching for changes in D:\workspace_vscode\blog\{archetypes,content,data,layouts,static,themes}
Watching for config changes in D:\workspace_vscode\blog\config\_default
Environment: "development"
Serving pages from memory
Running in Fast Render Mode. For full rebuilds on change: hugo server --disableFastRender
Web Server is available at http://localhost:1313/ (bind address 127.0.0.1)
Press Ctrl+C to stop

いけてるみたい。

update-jane

若干文字が太くなってる気がするw

netlify.tomlの修正

こいつも修正しておかないとデプロイできなくなるので修正しておく。

各バージョンを 0.62.00.110.0 に修正した。

おわりに

久しぶりにアップデートして良くなった!気がする。
メニューもつけるように各記事のオプションを修正しようかな。

2/18 追記
下記に、Hugoのthemeアップデートの方法について記載があった。
git submodule update --rebase --remote を実行すれば良いらしい。
https://gohugo.io/hosting-and-deployment/hosting-on-netlify/

Hugo で構築されています。
テーマ StackJimmy によって設計されています。