Updating the Sass compiler to Dart-Sass

[maxime4000]

Node-Sass as been depreciate for now 7 month.

In my project, I have migrate to dart-sass which is able to compile iTwinUI.
There is some warning about depreciating of feature that iTwinUI use that will be remove in v2. Migration with breaking change can be an hassle, so I'm suggesting that we start to migrate to sass before it get worst.
Because this package is all about compiling Sass files, I think iTwinUI should be using the latest version of the Sass compiler.

I suggest we migrate from node-sass to sass in the near future.

[mayank99]

We had looked into this in the past, and decided not to migrate from node-sass because the dart sass npm package is much slower (build takes 2-3 times longer with renderSync and upto 5 times longer with render). This is a known issue that we're hoping gets fixed in the near future: sass/dart-sass#113 (comment)

What deprecation warnings are you seeing?

[maxime4000]

While it's true that node-sass is faster than dart-sass, I still think that the config/script to generate iTwin CSS could be more optimize.

For the deprecation warnings, in general they are related to division with slash that will stop being supported in the 2.0 version, but the log get overwrite before I have time to look at it.
Seem like this should fix at least a big chunk of the warning I get :

npm install -g sass-migrator
sass-migrator division **/*.scss

[mayank99]

Yeah we can't run that migrator yet because it will add math.div everywhere which is only supported in dart-sass 1.33+ and not supported in node-sass at all. I think we'll just have to wait for now. There is some good progress being made: https://github.com/sass/embedded-protocol

[veekeys]

Seems we have a solution:
#132