Hugo 错误模板 : _default/single. html :20:16: executing "main" at <$img. Fill> : error calling Fill: *resources. genericResource is not an image

Question

问题

我将我的一些图像放在 /assets/images 文件夹中。然后在 layouts/_default/single.html 中，我为不同的屏幕尺寸创建了一个主图部分，如下面的代码所示。问题是 Hugo 说“*resources.genericResource 不是图像”，而类型检查确认它是图像。更有趣的是，如果我在我的机器上运行 Hugo 时添加以下更改，它就会起作用。但是我停止并重新启动，它显示错误并且没有出现。

一些笔记

.Params.image:每个帖子在前面都有一个图像的名称，如 image:/images/bird.jpg

如果 $img 无效，我会跳过此代码，因此有些帖子没有主图。

Hugo 通过 Choco 安装:

Hugo 静态站点生成器 v0.78.2-959724F0 windows/amd64 BuildDate: 2020-11-13T10:08:15Z

代码

<!-- layouts/_default/single.html-->
{{ $img := resources.GetMatch .Params.image }}
{{ if $img }}
{{ if eq $img.ResourceType "image" }}
    {{$hero := $img.Fill "568x400"}}
    {{$hero_sm := $img.Fill "768x400"}}
    {{$hero_md := $img.Fill "1024x400 q50"}}
    {{$hero_lg := $img.Resize "x400 q50"}}
    
    <style>
        .post__hero{
            background-image: url('{{ $hero.Permalink }}');
        }
        @media (min-width: 568px) {
            .post__hero{
            background-image: url('{{ $hero_sm.Permalink }}');
        }
        }
        @media (min-width: 768px) {
            .post__hero{
            background-image: url('{{ $hero_md.Permalink }}');
        }
        }
        @media (min-width: 1024px) {
            .post__hero{
            background-image: url('{{ $hero_lg.Permalink }}');
        }
        } 
    </style>
    <div class="single-image post__hero"></div>
{{end}}
{{end}}

Answer 1

终于找到了。问题是 Hugo 不支持 WebP 格式的图像处理。我的一些图像是 WebP。可能是因为这两个条件:

{{ if $img }}
{{ if eq $img.ResourceType "image" }}

已为 WebP 图像传递，但函数 Fill 和 Resize 产生了错误。所以，我不得不用 JPEG 格式替换它们。