LESS的“导入(引用)“样式""的等效项是什么?在SASS中 [英] What is the equivalent of LESS's "import (reference) 'style'" in SASS

问题描述

除了application.css.scss外，我还有多个部分，例如homepage.css.scss.目前，我必须在每个变量中添加@import'bootstrap'才能使用引导变量和mixins.

In addition to application.css.scss, I have multiple partials like homepage.css.scss. At the moment I have to add @import 'bootstrap' to each one of them in order to use bootstrap variables and mixins.

假设我想将我的默认链接颜色更改为红色，我将其添加到application.css.scss中.但是homepage.css.scss中的链接不会是红色的，因为引导导入将用蓝色覆盖它.

Let's say I want to change my default links colour to red, I'd add that to application.css.scss. But the links in homepage.css.scss will not be red because the bootstrap import will override it with blue.

在LESS中，我可以执行@import(引用)引导程序"，如何在SASS中执行此操作?

In LESS, I can do @import (reference) "bootstrap", how can I do that in SASS?

推荐答案

您将获得的最接近的是静默类/占位符.这些工作方式与LESS和引用的工作方式略有不同，您可以在这里阅读更多有关它们的信息:

The closest you will get is a silent class / placeholder. These work a little different to how LESS and reference work, you can read more on them here: http://blog.teamtreehouse.com/extending-placeholder-selectors-with-sass

很少

lib.less

.class {
   background: red;
}

main.less

@import (reference) "lib";

.anotherClass {
   &:extend(.class);
}

SASS

lib.sass

%class {
  background: red;
}

main.sass

@import "lib";

.anotherClass {
  @extend %class;
}

CSS输出

.anotherClass {
  background: red;
}

这篇关于LESS的“导入(引用)“样式""的等效项是什么?在SASS中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！