2020/03/07時点で最新のHugo v0.66.0でhugo
コマンドを使ってMarkdownファイルからHTMLを生成した。
すると、Markdown中に含まれていたHTMLタグがすべて<!-- raw HTML omitted -->
と出力され消えるようになってしまった。
結論から言うと、Hugo v0.60.0からは設定で明示的に「HTMLタグをそのまま出力する」オプションを設定する必要があった。
TL;DR
- Hugoを最新版のv0.66.0にしたらMarkdown文書中のHTMLタグが出力されなくなってしまった
- 生成後のHTMLファイルをみると、
<!-- raw HTML omitted -->
になっていた。
- 生成後のHTMLファイルをみると、
- Hugo v0.60.0から利用されている
Goldmark
というMarkdown Parserのデフォルト設定はHTMLタグを出力しない - Markdown中のHTMLタグを出力するには、
config.toml
などでunsafe
オプションをtrue
にする必要がある
[markup]
[markup.goldmark]
[markup.goldmark.renderer]
unsafe = true
記事で利用しているHugoのバージョンは次の通り。
$ hugo version
Hugo Static Site Generator v0.66.0/extended darwin/amd64 BuildDate: unknown
Markdown中のHTMLタグが出力されなくなった。
このブログはHugoという静的サイトジェネレータを使って構築されている。
HugoはMarkdownでWebページを記述することができる。
私のブログ記事ではAmazonへのリンクや次のようなリッチなリンクを生成するため、Markdown記事内に<div>
タグや<iframe>
タグが書いていた。
(ちなみにこのようなリンクはiframelyというサービスで生成している。)
すこし気になるところがあったので、brew upgrade hugo
コマンドでhugo
コマンドを2020/03/07時点最新のv0.66.0にした。
その結果、ブログ記事となるMarkdown内にそのまま書いていたHTMLタグがサイトに公開するHTMLから消えてしまった。
生成されたHTMLを見ると、<div>
タグや<iframe>
タグが書いていたところがすべて以下のようになっていた。
<p>そして、<code>claat</code>はGoogleが提供している公式ツールだ。<code>claat</code>を使うとGoogle DocからこのCodelabs形式のチュートリアル・ハンズオンを簡単に作成することができる。</p>
-
- <p><div class="iframely-embed"><div class="iframely-responsive" style="height: 168px; padding-bottom: 0;"><a href="https://github.com/googlecodelabs/tools" data-iframely-url="//cdn.-iframe.ly/fSusqIF"></a></div></div><script async src="//cdn.iframe.ly/embed.js" charset="utf-8"></script></p>
-
+ <!-- raw HTML omitted -->
Hugo v0.60.0からMarkdown中のHTMLタグがオミットされるようになった
調べてみたところ、Hugo自体の設定が変わったらしい。
Hugo v0.60.0から新しく採用されたGoldmark
というMarkdownパーサーはデフォルト設定でMarkdonw中のHTMLタグを無視する。
- Configure Markup | Hugo
Goldmark is from Hugo 0.60 the default library used for Markdown.
unsafe By default, Goldmark does not render raw HTMLs and potentially dangerous links. If you have lots of inline HTML and/or JavaScript, you may need to turn this on.
なので、このunsafe
オプションをtrue
にすることで、再びMarkdown内のHTMLタグがHugoで生成された記事内でも表示されるようになった。
私の場合はconfig.toml
ファイルに設定を書いていたので、以下のような設定を追加した。
[markup]
[markup.goldmark]
[markup.goldmark.renderer]
unsafe = true
終わりに
新しい機能を追加するとき、デフォルト設定は挙動が変わらない方向にしておかないと、アップデートしたユーザーが困ったり、びっくりしたりするという教訓を得た。