broccoli-sass,node-sass,breakpoint-sass

时间:2014-12-11 21:37:11

标签: sass breakpoint-sass broccolijs node-sass

我尝试在我的Ember CLI项目中使用breakpoint-sassbroccoli-sass,但在使用@include breakpoint(100px)时,它会因以下错误而崩溃:

cannot add or subtract numbers with incompatible units
 [string exception]

重现起来很简单:

# install latest version of ember-cli:
$ npm install -g ember-cli

# create a new app:
$ ember new breakpoint-sass-test
$ cd breakpoint-sass-test

# add broccoli-sass
$ npm install --save-dev broccoli-sass

# install breakpoint:
$ bower install breakpoint

# add the following line to `Brocfile.js`:
app.import('bower_components/breakpoint/breakpoint/_breakpoint.scss');

# add the following lines to `app/styles/app.scss`: 
@import "bower_components/breakpoint/breakpoint/_breakpoint.scss";

.test {
  @include breakpoint(100px) {
    display:none;
  }
}

1 个答案:

答案 0 :(得分:1)

broccoli-sass使用libsass(通过node-sass),而不是Ruby Sass实现,就我所知,breakpoint-sass目前还不能与libsass一起使用。您可以尝试像Bourbon / Neat这样的东西来获得类似断点的功能。 Neat有媒体mixin,与Breakpoint Sass非常相似。

http://thoughtbot.github.io/neat-docs/latest/#media