Sass 不兼容单元：'；rem'；和'；px'；-引导4.3.1

在自定义重写sass文件中重写Bootstrap 4.3.1变量时，我得到了“不兼容的单位：'rem'和'px'”

我已经尝试按照Bootstrap4文档中的说明，将自定义sass文件中的以下路径放置在文件顶部和文件的最后一行

@import "node_modules/bootstrap/scss/functions"; 
@import "node_modules/bootstrap/scss/variables";
@import "node_modules/bootstrap/scss/mixins";

终端错误

ERROR in ./src/scss/main.scss (./node_modules/raw-loader!./node_modules/postcss-loader/lib??embedded!./node_modules/sass-loader/lib/loader.js??ref--14-3!./src/scss/main.scss)

Module build failed: 
$custom-select-feedback-icon-padding-right: calc((1em + #{2 * $custom-select-padding-y}) * 3 / 4 + #{$custom-select-padding-x + $custom-select-indicator-padding}) !default;
                                                                                                                                                                 ^
      Incompatible units: 'rem' and 'px'.

---

首先从SCSS文件中删除

，这是

calc（）

函数的问题，而不是

px或rem

的问题

注

calc（）

函数是CSS的内置函数，因此无论何时在SCSS中调用

calc（）

，都需要使用

{}

技术来使用变量

height: calc(100% - #{$body_padding})

现在我给你们举一个例子

$custom-select-padding-y = 50px;
    
$custom-select-feedback-icon-padding-right: calc((1em +  #{2 * 50px}) * 3 / 4 + #{$custom-select-padding-x + $custom-select-indicator-padding}) !default;

2*50px=100px

等等之后，它无法计算

1em+{random px}

所以，它的返回未定义，编译器给出错误

calc（）

计算

2*5px=10px或2*1rem=32px

---

calc（）

无法计算

2rem+1em

，

1rem+1px

等等。

为什么

？在css文件中？忽略
您找到解决方案了吗？