CSS concatenation in pipeline and inlining via <script>?

support
1

I manage to concatenate my CSS files into a bundle using Get.Resource etc like so:

{{ $CSS := slice (resources.Get "css/bulma.css")
    (resources.Get "css/style.css") | resources.Concat "css/main.css" | 
      resources.PostCSS |  minify }}

After that, I can refer to the concatenated CSS as
<link rel="stylesheet" as="style" href="{{$CSS.Permalink}}">
However, Google’s pagespeed/lightouse frowns upon this and suggests inlining the CSS with ´<script>…</script>`.
Which I can do, if I avoid the concatenation step by something like

{{$myCSS := resources.Get "css/style.css"}}}
<style>{{$myCSS.Content}}</style>

But the return value of the concatenation pipe above does not contain a Content field, so $CSS.Content does not work. Is there another way to get at the contents of the CSS bundle and inline it?

2

I stand partially corrected: if one does something apparently useless which accesses $CSS.Permalink (like {{ $foo := $CSS.Permalink}}), Content is available afterwards, and useable when it’s piped into safeCSS

3

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.