question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

First-Class Calc: min/max are backwards-incompatible

See original GitHub issue
Module build failed (from ./node_modules/mini-css-extract-plugin/dist/loader.js):
ModuleBuildError: Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: 0.25rem and 0 are incompatible.
  ╷
9 │       $return: append($return, max($value, 0));
  │                                    ^^^^^^ 0.25rem
  │                                            ━ 0
  ╵
  node_modules/bootstrap/scss/mixins/_border-radius.scss 9:36   valid-radius()
  node_modules/bootstrap/scss/mixins/_border-radius.scss 19:20  border-radius()
  node_modules/bootstrap/scss/_images.scss 18:3                 @import
  node_modules/bootstrap/scss/bootstrap.scss 14:9               @import

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Reactions:8
  • Comments:10 (5 by maintainers)

github_iconTop GitHub Comments

11reactions
nex3commented, Sep 14, 2021

Sorry for the trouble, folks! This is the result of an unintentional backwards incompatibility in first-class calc support: we’re now parsing min() and max() expressions as calculations if they’re valid calculations, but we didn’t take into account the fact that calculations are a bit stricter about units than the old global min() and max() functions. We’ll need to take some time to design a more compatible way of handling this, but for the time being I’m going to partially revert this behavior:

  • min() and max() functions that appear outside of calculations will be parsed the same way they were in 1.39.2, as global function calls if they contain any Sass-specific arguments and as unquoted strings if they don’t.
  • min() and max() functions within calculations will continue to be parsed as calculations, since they could never have been parsed as global function calls in the first place.
4reactions
nex3commented, Sep 14, 2021

Sass 1.40.1 has been released with the fix. I’m going to keep this open to track the progress of re-enabling min() and max() calculations.

Read more comments on GitHub >

github_iconTop Results From Across the Web

minmax() - CSS: Cascading Style Sheets - MDN Web Docs
The minmax() CSS function defines a size range greater than or equal to min and less than or equal to max. It is...
Read more >
When Sass and New CSS Features Collide
Another problem arises when we want to use a CSS variable or the result of a mathematical CSS function (such as calc() ,...
Read more >
min, max, sum in Perl using List::Util
This is unfortunate as it should be 0, but in order to provide backwards compatibility, if the provided list is empty then undef...
Read more >
HTML5 + CSS3 Backwards compatibility on calc() css function
If you want to solve this particular case, I would suggest that you (perhaps a bit ironically) try relying on the good old...
Read more >
Backward compatibility guidelines - Microsoft Learn
Never change the signature of existing methods · Avoid changing existing method logic · Do not remove methods from grain interfaces · Recommended ......
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found