css - 编译 bootstrap.scss 时出错 - _root.scss 问题

Question

我在编译 bootstrap sass 文件时遇到错误。错误如下所示。当我注释掉 _root.scss 的第 4 行和第 8 行时，它起作用了，但这不是一个理想的解决方案。这是怎么回事？ - 我正在运行最新版本的 Sass 3.5.3

Error: Invalid CSS after "...lor}: #{$value}": expected "{", was ";"
        on line 4 of /Users/.../bootstrap-4.0.0/scss/_root.scss
  ...

1: :root {
2:   // Custom variable values only support SassScript inside `#{}`.
3:   @each $color, $value in $colors {
4:     --#{$color}: #{$value};
5:   }
6: 
7:   @each $color, $value in $theme-colors {
8:     --#{$color}: #{$value};
9:   }

Answer 1

这看起来像是 SASS 编译器本身的错误。 在这里你有非常相似的问题:

• https://github.com/twbs/bootstrap/issues/24549

• https://github.com/sass/sass/issues/2383

试试这个:

1: :root {
2:   // Custom variable values only support SassScript inside `#{}`.
3:   @each $color, $value in $colors {
4:     --color-#{$color}: #{$value};
5:   }
6: 
7:   @each $color, $value in $theme-colors {
8:     --color-#{$color}: #{$value};
9:   }