ToCSS errors out in v0.125.6

I have a customers website using Tailwind CSS.

In v0.125.5 running hugo server works just fine.

In v0.125.6 running hugo server fails with this error:

Error: error building site: TOCSS: failed to transform "/css/index.dev.1715136587582.css" (text/css): "css/index.dev.1715136587582.css:1085:25": Function rgb is missing argument $green.

I can’t look into that file because it’s a step somewhere in the middle of a pipeline… What would be your approach to debug this?

We don’t use rgb in the codebase in general, so it might be related to Tailwind. I am not sure if I can post the SCSS (corporate website).

The pipeline in question is this:

{{- $twoptions := dict
    "targetPath" "twtheme.css"
    "enableSourceMap" "false"
    "includePaths" (slice "node_modules/")
-}}
{{- if site.IsServer -}}
    {{- $twoptions = $twoptions | merge (dict "outputStyle" "expanded") -}}
{{- else -}}
    {{- $twoptions = $twoptions | merge (dict "outputStyle" "compressed") -}}
{{- end -}}
{{- $tailwind := resources.Get "scss/theme.scss" -}}
{{- $tailwind = $tailwind | resources.ToCSS $twoptions -}}
{{- $tailwind = $tailwind | resources.PostCSS (dict "config" "themes/wonderland/postcss.config.js") -}}
{{- if site.IsServer -}}
    {{- $tailwind = $tailwind | resources.ExecuteAsTemplate (printf "css/index.dev.%v.css" now.UnixMilli) . -}}
    {{- $tailwind = $tailwind | resources.PostProcess -}}
    <link rel="stylesheet" href="{{- $tailwind.Permalink -}}">
{{- else -}}
    {{- $tailwind := $tailwind | minify | fingerprint | resources.PostProcess -}}
    <link rel="stylesheet" href="{{- $tailwind.Permalink -}}" integrity="{{- $tailwind.Data.Integrity -}}">
{{- end -}}

I assume that just building the site (hugo) works fine. Is that correct?

My comments below are, at best, a guess…

To begin troubleshooting hugo server, I’d change this…

{{- if site.IsServer -}}
    {{- $tailwind = $tailwind | resources.ExecuteAsTemplate (printf "css/index.dev.%v.css" now.UnixMilli) . -}}
    {{- $tailwind = $tailwind | resources.PostProcess -}}
    <link rel="stylesheet" href="{{- $tailwind.Permalink -}}">
{{- else -}}

…to this

{{- if site.IsServer -}}
    {{- $tailwind = $tailwind | resources.ExecuteAsTemplate (printf "css/index.dev.%v.css" now.UnixMilli) . -}}
    {{/* {{- $tailwind = $tailwind | resources.PostProcess -}} */}}
    <link rel="stylesheet" href="{{- $tailwind.Permalink -}}">
{{- else -}}

I think changes in v0.123.0+ improved the situation (e.g., we now render to disk when running hugo server), but historically it’s been a bad idea to post process resources when running hugo server.

https://gohugo.io/functions/resources/postprocess/#limitations

The underlying problem may be related to something entirely different, but I’d start with a clean baseline to see what happens.

1 Like

You are right. Removing the postprocessing fixed the issue, and it wasn’t an issue on normal builds. I guess it was Tailwind-related because that had purging configured only on a build, not on dev servers.

1 Like

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