Question - Are there plans to support dart-sass and its newly introduced @use modular system?

1

I’ve been quite interested in transitioning away from my standard gulp build process to make use of the Hugo’s native asset build pipeline. However, it seems the sass implementation is built on libsass which currently doesn’t support the newly introduced @use modular system (@import to be deprecated in a couple of years or so).

From reading the blogs it seems the Sass team is planning to make Dart Sass will become the primary implementation of sass moving forward.

Are there any plans to switch to the dart-sass to support this new feature or will hugo continue to update the libsass library once this feature gets implemented more broadly?

2 Likes
2

seems like it is being thinked about…

1 Like
3

@bep has closed that issue and engage libsass crew directly:

@bep, if there are some updates, please let us know.

4

I have upgraded Hugo’s libsass integration (phew!). In master we’re now at LibSass 3.6.3 (the latest). But Sass Modules isn’t in LibSass yet (I think it’s in their Work In Progress 4.0 branch) – but at least this means we’re ready for it when it when it comes.

3 Likes
5
6

Noted with thanks! I was about to post the doc link (Sass: @use) where libsass is yet to be supported. =)

1 Like
7

It seems like Sass team have decided to deprecate Libsass and only supporting dart-sass going forward. What will this mean for Hugo’s native sass compilation?

8

What will this mean for Hugo’s native sass compilation?

That it will migrate to a way to compile CSS files that is not deprecated. The big bad word “deprecated” by the way does not mean it’s dead. It will die in-officially in October 2021 and officially in October 2022 according to the announcement. Which is many quarantine days in the future :slight_smile:

1 Like
9

Ah I see thank you for your response!

10

I started implementing the “Hugo dart SASS” support tonight. Hoping to get it into my XMas release. It will mean that you would need to install Dart Sass on your PC in addition to Hugo (e.g brew install sass/sass/sass), and (I have not checked) but I would expect Netlify and gang to provide that too if they’re not already doing it.

4 Likes
11

It’s available precompiled via npm. So there is hope this might work out of the box somehow.

The Dart SDK can be installed with some scripting wizardry if required.

1 Like
12

Which Hugo version will it be in, Extended, Base or both?

13

Both – LibSASS is currently the only reason we build an extended version, but that may change if we for some reason need to integrate with some other C/C++ libraries.

14

Yes, I will make a mental note about being a little smart about the binary path lookup (e.g. also look in node_modules?).

15

I have checked a little, and the binary you would need to install comes from the dart-sass-embedded project.

  1. The bad news is that it is still in beta (beta 5); I asked a question about it here: https://github.com/sass/dart-sass-embedded/issues/20
  2. The good new is that it seem to work great for the simple tests I have put it through …
1 Like
16

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

18

You may want to watch this repo for progress: https://github.com/bep/godartsass

The embedded Dart is in beta 5 which I assume means “pretty mature” – so I’ll consider adding this as an optional SCSS implementation in toCSS – and we can consider making it the default later.

6 Likes
19

Amazing, thank you so much for making Dart Sass happen! It has unblocked a huge workflow issue for me.

1 Like