build error with sass and blueprintjs: SassError: (path: (fill: #5c7080)) isn't a valid CSS value.

[FrancisOMascarenhas]

Environment

• Package version(s):

  - node v20.16.0
  - blueprintjs/core - v3.50.2
  - sass: v1.79.2
  - react: v16.14.0
  

• Browser and OS versions: windows 11, chrome 128.0.6613.138

Question

Facing an issue when building react project

have followed these links to get a possible solution, however we do not have a custom config and currently don't want to make changes to react scripts.
#5334
#6051

is there a way i can get the build working by upgrading to a particular version of blueprint js (we are open for upgrading) without changing any config/webpack files?

[ashleighp13]

Hi @FrancisOMascarenhas - is this issue reproduceable on a newer version of blueprint?

[FrancisOMascarenhas]

Hi @FrancisOMascarenhas - is this issue reproduceable on a newer version of blueprint?

Hi @ashleighp13 , yes i was able to reproduce it on v4.1.2 too with sass.

[SslTomH]

I get a similar sass-loader error after upgrading from blueprint/core v5.12 to v5.13.1, though it's less to do with svgs and more a mixed unit issue.

ERROR in ../../node_modules/@blueprintjs/core/lib/css/blueprint.css (../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[2].use[1]!../../node_modules/sass-loader/dist/cjs.js!../../node_modules/@blueprintjs/core/lib/css/blueprint.css)
Module build failed (from ../../node_modules/sass-loader/dist/cjs.js):
Incompatible units: '%' and 'px'.

 @ ../../node_modules/@blueprintjs/core/lib/css/blueprint.css 8:6-163 20:17-24 24:7-21 50:25-39 51:36-47 51:50-64 55:6-65:7 56:54-65 56:68-82 62:42-53 62:56-70 64:21-28 75:0-133 75:0-133 76:22-29 76:33-47 76:50-64 53:4-66:5
 @ ./src/index.tsx 17:0-49

webpack compiled with 1 error