Deprecation Warning: Using / for division outside of calc() is deprecated and will be removed in Dart Sass 2.0.0

Question

In these functions I compile rem to px and em to px:

$base: 16 !default;

@function scut-strip-unit ($num) {
  @return $num / ($num * 0 + 1);
}

@function rem ($pixels) {
  @return scut-strip-unit($pixels) / $base * 1rem;
}
@function em ($pixels, $context: $base) {
    @return #{$pixels/$context}em;
  }

But with Sass v1.49, we are facing this error:

Error
Deprecation Warning: Using / for division outside of calc() is deprecated and will be removed in 
Dart Sass 2.0.0.

Recommendation: math.div(scut-strip-unit($pixels), $base) or calc(scut-strip-unit($pixels) / $base)

More info and automated migrator: https://sass-lang.com/d/slash-div

  ╷
8 │   @return scut-strip-unit($pixels) / $base * 1rem;
  │           ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  ╵

Deprecation Warning: Using / for division outside of calc() is deprecated and will be removed in 
Dart Sass 2.0.0.

Recommendation: math.div($pixels, $context) or calc($pixels / $context)

More info and automated migrator: https://sass-lang.com/d/slash-div

   ╷
11 │     @return #{$pixels/$context}em;
   │               ^^^^^^^^^^^^^^^^
   ╵
   

Answer 1

Using / to make divisions outside of calc function will not be supported anymore. Here is an overview of the reasons why from the documentation:

Sass currently treats / as a division operation in some contexts and a separator in others. This makes it difficult for Sass users to tell what any given / will mean, and makes it hard to work with new CSS features that use / as a separator.

You should either use math.div from sass:math:

@use "sass:math";

body {
  font-size: math.div(50, 16) * 1px;
}

Or use / inside calc:

body {
  font-size: calc(50 / 16) * 1px;
}