broccoli-sass、node-sass、断点-sass答案

【问题标题】：broccoli-sass, node-sass, breakpoint-sassbroccoli-sass、node-sass、断点-sass
【发布时间】：2015-02-10 12:38:37
【问题描述】：

我尝试在我的 Ember CLI 项目中使用 breakpoint-sass 和 broccoli-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;
  }
}

【问题讨论】：

标签： sass breakpoint-sass broccolijs node-sass

【解决方案1】：

broccoli-sass 使用 libsass（通过 node-sass），而不是 Ruby Sass 实现，据我所知，此时断点-sass 不适用于 libsass。您可以尝试类似 Bourbon/Neat 的方法来获得与断点类似的功能。 Neat 有 media mixin，与 Breakpoint Sass 非常相似。

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

【讨论】：