Importing bootstrap.scss breaks SASS compilation

• Operating system and version: WIndows 10
• Browser and version: Chrome 93
• Suggested fix: Use math.max() instead of max().

I have create-react-app project (react-scripts@4.0.3). It works if I do npm start, but not when npm run build. This error occurs if you’re using Dart SASS 1.40.0 and higher.

SassError: 0.2rem and 0 are incompatible.
  ╷
9 │       $return: append($return, max($value, 0));
  │                                    ^^^^^^ 0.2rem
  │                                            ━ 0
  ╵
  node_modules\bootstrap\scss\mixins\_border-radius.scss 9:36   valid-radius()
  node_modules\bootstrap\scss\mixins\_border-radius.scss 20:20  border-radius()
  node_modules\bootstrap\scss\_reboot.scss 322:3                @import
  node_modules\bootstrap\scss\bootstrap.scss 17:9               @use
  src\styles\custom.scss 1:1                                    @use
  src\styles\index.scss 1:1                                     root stylesheet

[baijifeilong]

Uninstall sass, install node-sass.

[kris2kris]

It seems like SASS fixed it in the latest version (1.42.0) Checked locally, it really works now

For me it does not work with 1.42.0, 1.39.2 is the last version I can use.