@import'指南针'是否包含整个框架？

Question

我开始在一个地方导入共享的东西,比如变量和mixin - css清单文件.现在我正在使用文件的直接路径导入一些Compass mixins.

我的问题是,如果使用@import 'compass'将整个框架注入application.css,还是通过查看sass文件中的引用然后只导入所需的mixins来完成？

我不想包括一切.

Answer 1

根据文档 @import 'compass'将导入CSS3,Typography和Utilities模块.这些模块不会向输出CSS中注入任何内容,它们只包含mixins.

通过将导入限制为特定模块或子模块(即@import 'compass/css3/image'),您将减少将SASS文件编译为CSS所需的时间.

例如,让我们创建两个文件.

// all.scss

@import "compass";

.candy {
  @include background(linear-gradient(top left, #333, #0c0));
}

// module.scss

@import "compass/css3/images";

.candy {
  @include background(linear-gradient(top left, #333, #0c0));
}

如果我们编译它们(compass compile sass/FILENAME.scss),结果CSS将是相同的:

.candy {
  background: -webkit-gradient(linear, 0% 0%, 100% 100%, color-stop(0%, #333333), color-stop(100%, #00cc00));
  background: -webkit-linear-gradient(top left, #333333, #00cc00);
  background: -moz-linear-gradient(top left, #333333, #00cc00);
  background: -o-linear-gradient(top left, #333333, #00cc00);
  background: linear-gradient(top left, #333333, #00cc00);
}

现在让--time我们为编译命令添加参数并比较结果.对于我的机器,编译需要1.516秒,all.css而0.118秒module.css.