CSS Purge + Forestry

Hey everybody, I’ve got a question about using the new Post Process feature in Hugo.

I’m using Forestry as a CMS and trying to add some styling options with front matter. Right now I’ve got an option that lets you select the font-size. Then in my templates it creates the class from the front matter.

The issue I’m running into is that Tailwind is expecting the full class name for Purge to work properly.

Would the Post Process feature help with this? Does it build the site first (which would turn the hugo variables into strings) and then I’d be able to run Purge on that?

Hi there, I am on my weekly “let’s answer all posts with no answer at all”-run and stumbled upon your post. The thing with your problem is, that Hugo does not know about layouts when it’s processing assets. Those are two more or less separated things.

You could have a look into the documentation of the following two features:

(Take notes while processing templates from the layouts directory)

(Creating a resource like CSS from a template file)

You could probably scratch the info you require and then create your css not from SCSS (or not completely from SCSS) but use a template file that accesses the scratched variable.

I never used Forestry to know what exactly you are trying to achieve, so maybe, if the system allows it, try to think about a custom post type in Hugo that creates Forestry configuration files that add the classes you offer?

The answer is yes to all of the above.

The traditional Tailwind approach is to use the templates as input to purge, but that can miss stuff (dynamic classes, markdown …).

Have a look at GitHub - bep/hugo-starter-tailwind-basic: A basic and simple to set up Hugo with TailwindCSS starter project.

Esp. "," {{ .Title }}","

Note that PostProcess has some gotchas if you enable it in server mode, hence the IsProduction.

1 Like

Hey @bep I was able to get it figured out :slight_smile: super pumped!

1 Like