1

当我使用 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 存储库中:

@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 和 Compass 1.0.0.rc.1 来创建主题,以获得波旁威士忌的全部好处。

更新:

(糟糕,我忘了说 Neat 或 Bitters。我也在使用它们。对不起。)

我已经按照 Bitters 的Github 指南中的描述更新了文件:

@import 'compass';

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

@import 'custom/custom';

但是会发生同样的错误。

4

1 回答 1

2

我有类似的错误

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

@import 'compass';工作的波旁威士忌/整洁/苦味环境中添加时。删除它解决了问题。在 thinkbot 的库之后导入会给出一堆警告而不是错误,但可以正常工作。

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

@import 'custom/custom';

@import 'compass';

该问题似乎与 $base-line-height 变量有关。 在 compass $base-line-height 设置为$base-line-height 24px; In bourbon $base-line-height 设置为$base-line-height: 1.5; 当罗盘在波旁威士忌加载后你会得到一个WARNING: $base-line-height must resolve to a pixel unit. ,因为波旁威士忌将它设置为 1.5。

如果您尝试$base-line-height: 24px;在命令之前添加,@import 'compass';则会收到错误: (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';

现在你们两个一起玩。在波旁威士忌之前导入指南针的地方,我无法让它以其他方式工作。我想这个冲突应该在图书馆层面解决(波旁威士忌?)。

于 2014-10-27T20:54:43.777 回答