HUGO

Custom CSS throws: Type <nil> not supported in Resource transformations

Hi,

I am actually building a theme with Hugo. The theme is going to use Bootstrap from CDN, so I’ve just hardcoded bootstrap references. However, I want to apply some small customisation to colour palette.
With themestr.app I’ve generarated an additional CSS to change bootstrap.

I’ve downloaded the css file and put into the asset/css directory. Then, I’ve added the following code:

<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
{{ $baseCSS := resources.Get "css/custom.css" | resources.ExecuteAsTemplate "css/custom.css" . | minify | fingerprint }}
{{ $extraCSS := .Scratch.Get "css" | uniq }}
{{ $allCSS := $baseCSS | slice | append $extraCSS }}
{{ range $allCSS }}
<link rel="stylesheet" href="{{ .Permalink }}" integrity="{{ .Data.Integrity }}">
{{ end }}

However, hugo raise an error:

theme/layouts/partials/head.html:7:61": execute of template failed: template: partials/head.html:7:61: executing "partials/head.html" at <resources.ExecuteAsTemplate>: error calling ExecuteAsTemplate: type <nil> not supported in Resource transformations

My custom.css is available at this pen https://codepen.io/lunaticmuch/pen/QegZpG

What’s wrong? If I make an HTML page attaching bootstrap and this css it works.

thanks in advance

LM

1st. check against

Is your css really a template?

2nd. for a single CSS is looks like

{{ $mccs := resources.Get "css/main.css" | minify }}{{ $secureMCCS := $mccs | resources.Fingerprint site.Params.digest }}
    <link type=text/css rel=stylesheet href={{ $secureMCCS.RelPermalink }} integrity={{ $secureMCCS.Data.Integrity }} media="screen, print" />

3rd. for appending files search the forum

found first this

My css isn’t a template, it’s just a full css.
The piece of the previous was copied, as last resort, from another post.
You solution, mentioned as point 2, is what I’ve tried already with an error.
I’ve figured it out now:

  1. The initial css I was using was already minified, apparently the ‘double minification’ doesn’t work very well.
  2. The CSS was working good when added to a static HTML page. Hugo raise an error processing it, there’s a semicolon unneeded at the end.

Thanks for the hint.