我通常喜欢将 Prettier 与 Visual Code 一起使用。但是,Prettier 在为 Hugo 编辑 HTML 模板时让我发疯,因为它不会保留对读者友好的格式:
{{ with .Site.Params.author }}<meta name="author" content="{{ . }}">{{ end }}
{{ hugo.Generator }}
{{ "<!-- plugins -->" | safeHTML }}
{{ range .Site.Params.plugins.css }}
<link rel="stylesheet" href="{{ .URL | absURL }} ">
{{ end }}
{{ "<!-- Main Stylesheet -->" | safeHTML }}
{{ $styles := resources.Get "scss/style.scss" | toCSS | minify | fingerprint }}
<link rel="stylesheet" href="{{ $styles.Permalink }}" integrity="{{ $styles.Data.Integrity }}" media="screen">
相反,它被转换为:
{{ with .Site.Params.author }}
<meta name="author" content="{{ . }}" />
{{ end }} {{ hugo.Generator }} {{ "
<!-- plugins -->
" | safeHTML }} {{ range .Site.Params.plugins.css }}
<link rel="stylesheet" href="{{ .URL | absURL }} " />
{{ end }} {{ "
<!-- Main Stylesheet -->
" | safeHTML }} {{ $styles := resources.Get "scss/style.scss" | toCSS | minify
| fingerprint }}
<link
rel="stylesheet"
href="{{ $styles.Permalink }}"
integrity="{{ $styles.Data.Integrity }}"
media="screen"
/>
如何自定义 Prettier 以更好地处理模板逻辑? (从那以后我就采取了禁用它的方法。)
最佳答案
我也对更漂亮地破坏我们的 GoHugo html 文件感到非常恼火。下面的插件修复了该行为。
prettier-plugin-go-template
如果您使用的是普通 *.html
文件,您需要注意 GoHugo
自述文件的部分:
To use it with GoHugo and basic
.html
files, you'll have to override the used parser inside your.prettierrc
file:
{
"overrides": [
{
"files": ["*.html"],
"options": {
"parser": "go-template"
}
}
]
}
关于html - Hugo HTML 模板的更漂亮和可视化代码设置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59431432/