thoughtbot / bourbon

A Lightweight Sass Tool Set
https://www.bourbon.io/
MIT License
9.09k stars 878 forks source link

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

Closed Machacek76 closed 1 month ago

Machacek76 commented 3 months ago

Hi! 👋

Firstly, thanks for your work on this project! 🙂

Today I used patch-package to patch bourbon@4.2.3 for the project I'm working on.

My problem with compile css

Recommendation: math.div($pxval, $base) or calc($pxval / $base) More info and automated migrator: https://sass-lang.com/d/slash-div

Recommendation: math.div($value, $value 0 + 1) or calc($value / ($value 0 + 1)) More info and automated migrator: https://sass-lang.com/d/slash-div

Here is the diff that solved my problem:

diff --git a/node_modules/bourbon/app/assets/stylesheets/functions/_px-to-em.scss b/node_modules/bourbon/app/assets/stylesheets/functions/_px-to-em.scss
index ae81a44..0c49f45 100644
--- a/node_modules/bourbon/app/assets/stylesheets/functions/_px-to-em.scss
+++ b/node_modules/bourbon/app/assets/stylesheets/functions/_px-to-em.scss
@@ -2,6 +2,8 @@
 // eg. for a relational value of 12px write em(12) when the parent is 16px
 // if the parent is another value say 24px write em(12, 24)

+@use "sass:math";
+
 @function em($pxval, $base: $em-base) {
   @if not unitless($pxval) {
     $pxval: strip-units($pxval);
@@ -9,5 +11,5 @@
   @if not unitless($base) {
     $base: strip-units($base);
   }
-  @return ($pxval / $base) * 1em;
+  @return math.div($pxval, $base) * 1em;
 }
diff --git a/node_modules/bourbon/app/assets/stylesheets/functions/_strip-units.scss b/node_modules/bourbon/app/assets/stylesheets/functions/_strip-units.scss
index 6c5f3e8..2a72f89 100644
--- a/node_modules/bourbon/app/assets/stylesheets/functions/_strip-units.scss
+++ b/node_modules/bourbon/app/assets/stylesheets/functions/_strip-units.scss
@@ -12,6 +12,8 @@
 ///
 /// @return {Number (Unitless)}

+@use "sass:math";
+
 @function strip-units($value) {
-  @return ($value / ($value * 0 + 1));
+  @return math.div($value, ($value * 0 + 1));
 }

This issue body was partially generated by patch-package.

enatario commented 1 month ago

Closing this as we're archiving the project.