Error building site: TOCSS-Dart due to worng sass library

Hi!

As in so many other posts, when running the SASS compilation HUGO fails with the following message:

ERROR Failed to render "/": TOCSS-DART: failed to transform "/sass/main.scss" (text/x-scss): got unexpected EOF when executing "sass". The user running hugo must have read and execute permissions on this program. With execute permissions only, this error is thrown.

I found quite useful this thread https://discourse.gohugo.io/t/error-building-site-tocss-dart/48047 as the output from the different suggested command are different, but I’m not succeeding in finding how to fix the problem.

Just for context, I’m on a macOS, and I’ve installed the Dart-Sass command as suggested in the Hugo Documentation so with the command brew install sass/sass/sass.

I guess the below means the dart-sass lib is not recognized by hugo

· hugo env                                                                                                                                                         
hugo v0.135.0+extended darwin/arm64 BuildDate=2024-09-27T13:17:08Z VendorInfo=brew
GOOS="darwin"
GOARCH="arm64"
GOVERSION="go1.23.1"
OptionParser::InvalidOption: invalid option: --embedded
  Use --trace for backtrace.
github.com/sass/libsass="3.6.6"
github.com/webmproject/libwebp="v1.3.2"

Below is the sass command which is not even recognizing the flags, and it returns the Ruby Sass library

· sass --embedded --version                                                                                                                                        
OptionParser::InvalidOption: invalid option: --embedded
  Use --trace for backtrace.

· sass -v                                                                                                                                                           
Ruby Sass 3.7.4

After looking for other ‘sass’ libraries in the system I found the dart-sass placed in a different folder /opt/homebrew/Cellar/sass/1.79.5/bin/sass, and running the same --embedded --version command I got the expected output:

· /opt/homebrew/Cellar/sass/1.79.5/bin/sass  --embedded --version                                                                                                   
{
  "protocolVersion": "3.1.0",
  "compilerVersion": "1.79.5",
  "implementationVersion": "1.79.5",
  "implementationName": "dart-sass",
  "id": 0
}

So, how can I set hugo to use that /opt/homebrew/Cellar/sass/1.79.5/bin/sass library?

I just removed the Ruby sass gem with the command sudo gem uninstall sass.
Now hugo env seems to find the right library.

· hugo env                                                                                                                                                          
hugo v0.135.0+extended darwin/arm64 BuildDate=2024-09-27T13:17:08Z VendorInfo=brew
GOOS="darwin"
GOARCH="arm64"
GOVERSION="go1.23.1"
github.com/sass/libsass="3.6.6"
github.com/webmproject/libwebp="v1.3.2"
github.com/sass/dart-sass/protocol="3.1.0"
github.com/sass/dart-sass/compiler="1.79.5"
github.com/sass/dart-sass/implementation="1.79.5"

and it’s compiling with no errors.
Hope I didn’t compromise any other software in my system.

From the docs at css.Sass | Hugo

Dart Sass is compatible with Hugo v0.114.0 and later.

If you have been using Embedded Dart Sass1 with Hugo v0.113.0 and earlier, uninstall Embedded Dart Sass, then install Dart Sass. If you have installed both, Hugo will use Dart Sass.

And check the PATH to have the right sass first

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