Fitness and everything else

Dart Sass Was Not Working For Me in Hugo

I have tried several times to switch my hugo to using Dart Sass rather than LibSass, since LibSass is depreciated. It works fine for now and should continue to work. It won’t get new features, though, so I wanted to switch to the newer version. Eventually, things may diverge too much.

The first order of business was getting Dart Sass running on FreeBSD. It’s not available in the ports tree, and neither is dart for that matter. Luckily, the Linux binary runs fine under FreeBSD’s Linuxulator It’s more of a band aid but it works for me.

It seemed to run fine, but it kept giving me random expected “{” errors with my indented sass files. I could get some of them fixed, but eventually, I got one that I couldn’t solve. The funny thing is an online converter choked on some of my files trying to translate them with no reason given too. What I eventually discovered is by removing certain commented out lines, it would work under the online tools to get it converted to SCSS.

It seems to me that the issue is or was that I have some spaces mixed in with the tabs. It looks the same to my eyes, but the program sees them differently since it’s going by the character code. If it’s that picky, then it’s reason enough for me to bite the bullet and use SCSS instead, so at least it relies on the curly brackets.

As much as I think the indented SASS file looks cleaner and easier for me to write, the SCSS is easier to debug. It’ll be a tradeoff that I have to accept.