Sass变量声明优先 [英] Sass variable declaration precedence

问题描述

我在两个文件中声明了同名变量。我按照以下顺序导入它们，并发现冲突。

FileName：Modal.scss

  $ grey：＃e1e1e1; //导入第一个
  

文件名：Variable.scss

  $ grey：＃999; //以后导入
  

预期的行为是值应该被覆盖。但是，我在CSS中获取了第一个导入的值（＃e1e1e1）而不是（＃999）。

我是否做了多次错误的声明变量的事情？

解决方案

显然，它会采取第一个变量声明。

例如，当您在Scss中使用引导程序时，必须在导入引导程序之前声明所有要覆盖的变量。

  $ brand-primary：＃000; 
 
 @import'bootstrap'; 
  

I am declaring variable of same name in two files. I import them in a following order and found a conflict.

FileName: Modal.scss

 $gray : #e1e1e1;    // Imported first

FileName: Variable.scss

 $gray : #999;       // imported later

Expected behaviour is that Value should be overwritten. However, I am getting First imported value (#e1e1e1) instead of (#999)in CSS.

Am I doing the wrong thing declaring variable multiple times?

解决方案

Apparently, it will take first variable declaration.

For example when you use bootstrap in Scss you have to declare all variables you want to override BEFORE you import bootstrap.

$brand-primary: #000;

@import 'bootstrap';

这篇关于Sass变量声明优先的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！