可以在导入的文件上重新定义_partial.scss中的变量吗?

时间:2021-05-14 20:38:56

Let's assume I have 2 partial sass files:

假设我有2个部分sass文件:

_partial1.scss  
_partial2.scss  

both are imported into: app.scss

两者都导入到:app.scss

If I define a variable...

如果我定义一个变量......

$mainColor: red //on partial1.  
$mainColor: green //on partial2 and   
$mainColor: blue //on app.scss

If I've set on the _partial2.scss file

如果我已设置_partial2.scss文件

body {
   background: $mainColor;
}

The color of my html background will be green...
BUT I need to be able to redefine it later on my app.scss so... Is there a way?

我的html背景的颜色将是绿色...但我需要能够稍后在我的app.scss上重新定义它...有没有办法?

I'm asking this because I'm using foundation and I have a subproject where I need to be able to change fonts and colors without changing the _settings.scss.
You can find my original question on Zurb's Foundation forum but I think an answer here could also be useful for someone else, not necessarily using foundation.

我问这个因为我正在使用粉底,我有一个子项目,我需要能够更改字体和颜色而不更改_settings.scss。您可以在Zurb的基金会论坛上找到我原来的问题,但我认为这里的答案也可能对其他人有用,不一定使用基础。

1 个解决方案

#1


You can redefine the variable at any point. Example:

您可以随时重新定义变量。例:

app.scss

$mainColor: blue;

#container {
  background: $mainColor; //blue
}

$mainColor: red;

#alert {
  background: $mainColor; //red
}

And here's a demo.

这是一个演示。

#1


You can redefine the variable at any point. Example:

您可以随时重新定义变量。例:

app.scss

$mainColor: blue;

#container {
  background: $mainColor; //blue
}

$mainColor: red;

#alert {
  background: $mainColor; //red
}

And here's a demo.

这是一个演示。