Hugo の Template が Prettier で崩れなくする
拡張機能の Prettier を導入した VSCode で Hugo の HTML template を作成すると折り返してほしくない場所で折り返してしまいます。そこで、プロジェクトのルートフォルダーに個別の設定ファイル( .prettierrc )を作成します。
Hugo の HTML template ように設定する
例えば、次のテンプレートを Prettier のデフォルトのまま保存したとします。
<h2 class="p-section\_\_name--t1">Latest New</h2>
{{- range first 8 .Site.RegularPages.ByDate.Reverse -}}
{{- .Render "li" -}}
{{- end -}}
すると、 .Render のあとで改行されてしまい正しい形に成形されません。
<h2 class="p-section\_\_name--t1">Latest New</h2>
{{- range first 8 .Site.RegularPages.ByDate.Reverse -}} {{- .Render
"li" -}} {{- end -}}
これを解決するには、プロジェクトのルートフォルダーに .prettierrc ファイルを作成し、次のように記載します。
{
"overrides": [
{
"files": ["*.html"],
"options": {
"parser": "go-template"
}
}
]
}