我刚学萨斯和使用了@import。 我有以下的情况...
_master.scss < - 这包含般的色彩我所有的全局变量
_child1.scss < - 这是我的子页面之一,但它需要掌握的东西
_child2.scss < - 这是对其他孩子的网页之一,但它也需要来自主人的东西
现在的问题是_master越来越相当大。 所以,当我保存的Visual Studio 2012使用思维空间的工具我的SCSS文件(孩子)我注意到,生成的css文件,包括所有的主文件为儿童的CSS。
从本质上讲,我想引用与“@import”,这是不利于业绩的主文件,每次收到重复的CSS。 有什么办法避免这种情况?
如果我的理解,这听起来像你真的可以从更好地利用受益谐音 。 如果你不希望所有 _master.scss需要进口,你应该仔细分解成组件,然后导入这些,你需要他们。
例如,如果master.scss
包含在您的网站中,所有颜色的字体,列布局,你可以打破它像下面这样:
_fonts.scss
_colors.scss
_column.scss
在master.scss
,你会导入每个。 然后,你可以导入这些更小的文件到child1
和child2
你需要他们。
如果这不是你要找的内容,请尝试澄清你的问题,我也许能帮助更多一点。
更新:有Imjared讨论后,他说,我应该只创建一个变量的文件。 这似乎对我来说,所以我更新这个答案,将其标记为正确的工作。
我解决了这个重复使用SCSS这个片段导入内容:
// src/main/scss/import-once-workaround.scss
$imported-once-files: () !default;
@function not-imported($name) {
$imported-once-files: $imported-once-files !global;
$module_index: index($imported-once-files, $name);
@if (($module_index == null) or ($module_index == false)) {
$imported-once-files: append($imported-once-files, $name);
@return true;
}
@return false;
}
导入文件由做到,那么:
@if not-imported("font") { @import "font"; }
我用这个方法取代Zurb的获得StyleDocco工作,看到http://paul.wellnerbou.de/2015/05/18/avoid-multiple-imports-of-the-same-scss-file-with-sass/