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编译器本身的一个错误。在这里你有非常类似的问题：

试试这个：

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:   }

Answer 2

如果您不担心丢失一些CSS变量，请注释掉_root.scss的第4行和第8行，然后重新编译。否则，将颜色添加到这些行的开头给出 --color-#{$color}: #{$value};

@@ -1,11 +1,11 @@
 :root {
   // Custom variable values only support SassScript inside `#{}`.
   @each $color, $value in $colors {
-    --#{$color}: #{$value};
+    --color-#{$color}: #{$value};
   }

   @each $color, $value in $theme-colors {
-    --#{$color}: #{$value};
+    --color-#{$color}: #{$value};
   }

   @each $bp, $value in $grid-breakpoints {

Check the solution

Update Color in _root.scss

Can't compile the SCSS

Answer 3

2019年11月 错误scss / _root.scss（第4行：“ ... lor}之后的无效CSS：＃{$ value}”：预期的“ {”为“;”）

我在Ubuntu 18.04上使用sass-3.7.4.gem

然后我意识到 “ Ruby Sass已经到了使用寿命，应该不再使用”

sudo npm install -g sass - 版 1.23.6使用dart2js 2.6.1编译

然后问题消失了，并在5秒内处理了css文件。

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

3 个答案: