使用 grunt 和 node-scss 编译引导 scss 时出错答案

【问题标题】：Error compiling bootstrap scss with grunt and node-scss使用 grunt 和 node-scss 编译引导 scss 时出错
【发布时间】：2014-07-30 02:29:48
【问题描述】：

我在尝试编译 bootstrap scss 时遇到以下错误。我使用bower install bootstrap-sass-official 检索了scss 文件。

Warning: bower_components/bootstrap-sass-official/vendor/assets/stylesheets/boot
strap/glyphicons:17: error: non-terminal statement or declaration must end with
';'
 Use --force to continue.

Aborted due to warnings.

我正在使用 node-sass 0.8.6 和 grunt-sass 0.8.1

这里是发生错误的sass的sn-p

15 @font-face {
16  font-family: 'Glyphicons Halflings';
17  src: url(if($bootstrap-sass-asset-helper, twbs-font-path('#{$icon-font-path}#{$icon-font-name}.eot'), '#{$icon-font-path}#{$icon-font-name}.eot'));
18  src: url(if($bootstrap-sass-asset-helper, twbs-font-path('#{$icon-font-path}#{$icon-font-name}.eot?#iefix'), '#{$icon-font-path}#{$icon-font-name}.eot?#iefix')) format('embedded-opentype'),
19   url(if($bootstrap-sass-asset-helper, twbs-font-path('#{$icon-font-path}#{$icon-font-name}.woff'), '#{$icon-font-path}#{$icon-font-name}.woff')) format('woff'),
20   url(if($bootstrap-sass-asset-helper, twbs-font-path('#{$icon-font-path}#{$icon-font-name}.ttf'), '#{$icon-font-path}#{$icon-font-name}.ttf')) format('truetype'),
21   url(if($bootstrap-sass-asset-helper, twbs-font-path('#{$icon-font-path}#{$icon-font-name}.svg##{$icon-font-svg-id}'), '#{$icon-font-path}#{$icon-font-name}.svg##{$icon-font-svg-id}')) format('svg');
22 }

【问题讨论】：

您在样式表的某处缺少;

标签： node.js twitter-bootstrap sass gruntjs

【解决方案1】：

如果有人在使用 NetBeans：

我在 NetBeans 中使用 _glyphicon.scss 文件和 mixin 文件 _image.scss 中的 Bootstrap SASS 文件时遇到了类似的错误。您将 if 语句保存在变量中的解决方案修复了这两种情况下的错误。

例如

@mixin img-retina($file-1x, $file-2x, $width-1x, $height-1x) {
   $image-if1: if($bootstrap-sass-asset-helper, twbs-image-path("#{$file-1x}"), "#{$file-1x}");
  background-image: url($image-if1);
  ...
}

【讨论】：

【解决方案2】：

我从 url 定义中取出 if 语句，并为它们定义了单独的变量，它起作用了。

【讨论】：