Rebecca Le

@sevensea.cat

The awesomeness of sass-autocompile

Apr 2, 2017

Sometimes there's a real urge to overcomplicate tech situations. When looking at converting my blog from Jekyll to Hugo (which I'll write a whole separate post about, soon!), one of the big listed weaknesses of Hugo is no concept of an asset pipeline - nothing to preprocess and compile stylesheets, JavaScript files, etc.

For larger websites, this might be a real concern. My blog, however, is pretty simple - just one or two Sass files, no JavaScript to speak of.

When researching support for Sass in Hugo, I stumbled across the following post about getting your editor to do the heavy lifting - I use Atom for development, Atom supports plugins for just about everything, so why can't I get Atom to handle the compilation for me, leaving Hugo to do what it does best?

It was like a lightbulb went off in my head.

Atom has the sass-autocompile package, to support autocompilation of Sass files on save. It's super-straightforward to install and configure, and now my editor will compile all the files I need on demand. It's great!

(I haven't quite worked out how to configure Hugo to copy only the compiled *.css files, not the source *.sass files, but that's for another day!)

I have a feeling I'll be expanding this in future, leveraging more and more functionality from Atom and it's plugins. Expect to see future TILs on this topic :)

← Home

Want to talk tech on Bluesky? You can find me at @sevensea.cat!

Built using 11ty and TailwindCSS.