线性梯度不是波旁威士忌中的"str-slice"字符串)

Question

当我用Bourbon创建主题时，我得到了下面的错误:

error sass/screen.scss (Line 18 of sass/bourbon/css3/_background.scss: 
$string: linear-gradient(10deg, #217142,#214271) is not a string for `str-slice')

以下是_background.scss的代码，因为它在Github repo上:

@mixin background($backgrounds...) {
    $webkit-backgrounds: ();
    $spec-backgrounds: ();
    @each $background in $backgrounds {
        $webkit-background: ();
        $spec-background: ();
        $background-type: type-of($background);
        @if $background-type == string or list {
            $background-str: if($background-type == list, nth($background, 1), $background);
            # line 18 just below:
            $url-str: str-slice($background-str, 0, 3);  
            $gradient-type: str-slice($background-str, 0, 6);
            @if $url-str == "url" {
                $webkit-background: $background;
                $spec-background: $background;
            }
        }
    }
}

我使用Sass 3.3.14 &指南针1.0.0.rc。1 .创建主题才能获得波旁威士忌的全部好处。

更新:

哦，我忘了讲Neat或Bitters了。我也在用它们。对不起。)

我已经更新了Github上Bitters' guide上描述的文件:

@import 'compass';
@import 'bourbon/bourbon';
@import 'base/grid-settings';
@import 'neat/neat';
@import 'base/base';
@import 'custom/custom';

Answer 1

我也有类似的错误

error (Line 18 of bourbon/css3/_background.scss: $string: linear-gradient(#c73b3c,#b8201f) is not a string for `str-slice')

在波本酒/纯酒/苦酒环境中添加@import 'compass';时。移除它就解决了问题。在thoughtbot的库之后导入会给出一堆警告，而不是错误，但工作正常。

@import 'bourbon/bourbon';
@import 'base/grid-settings';
@import 'neat/neat';
@import 'base/base';
@import 'custom/custom';
@import 'compass';

这个问题似乎与$base-line-height变量有关。在指南针$base-line-height设置为$base-line-height 24px;$base-line-height设置为$base-line-height: 1.5;当指南针加载波旁威士忌后，你得到一个WARNING: $base-line-height must resolve to a pixel unit.因为波旁威士忌把它设为1.5

如果你试图在@import 'compass';命令之前添加$base-line-height: 24px;，你会得到错误:(Line 36 of /usr/local/lib/ruby/gems/2.1.0/gems/compass-core-1.0.1/stylesheets/compass/typography/_vertical_rhythm.scss: Incompatible units: 'em' and 'px'.)

，因为$base-font-size在库之间也有冲突。

我找到的一个解决方案是这样设置导入:

@import 'bourbon/bourbon';
@import 'base/grid-settings';
@import 'neat/neat';
@import 'base/base';
@import 'custom/custom';
$base-font-size: 16px;
$base-line-height: 24px;
@import 'compass';

现在你有两个一起玩。在波旁威士忌之前，指南针是进口的，我没法用别的方法。我想这个冲突应该在图书馆级别(波旁威士忌?)修复。