Возможно ли создать локальный/частный sass mixin?

Question

У меня есть три Sass файлы: a.scss, b.scss, c.scss

a.scss:

@mixin font($size, $color){ 
    font-size: #{$size}; 
    color: #{$color} 
    } 

p{ 
    @include font(10px, blue) 
    } 

b.scss:

@mixin font() 
{ 
.. 
} 

c.scss

@import a.scss 
@import b.scss 

Я думаю, что mixin font() в b.scss переопределяет шрифт mixin ($ size, $ color) в a.scss.

p{ 
    @include font(10px, blue) // use mixin font() in b.scss, error 
    } 

Возможно ли создать местный/частный сассовый микрин? Или все миксины в sass являются глобальными, я должен дать им уникальное имя для каждого mixin?

Answer 1

Вы правы. Как и в типичном файле CSS, ваш проект sass скомпилирован сверху вниз. Таким образом, mixin, использующий то же имя, что и предыдущий, перезапишет его. Если вы хотите использовать оригинальный mixin в c.scss, вам придется переопределить его.

Answer 2

Микшины внутри селекторов являются локальными для этого селектора, как и переменные Sass. Эти два Примеси независимы друг от друга:

.foo{ 
    @mixin my_color(){ 
     color: #ffcc00; 
    } 
    @include my_color; 
} 

.bar{ 
    @mixin my_color(){ 
     color: #00ffcc; 
    } 
    @include my_color; 
} 

Таким образом, чтобы ответить на ваш последний вопрос - только Примеси, определенные на глобальном уровне являются глобальными, и вы можете в противном случае повторное использование имен безопасно. В вашем примере, если ваши a.scss, b.scss и c.scss структурированы для определения разных всеобъемлющих классов (например, .header, .main, .footer), вы можете иметь локальные смешанные шрифты для каждого.

Относно: Localizing/Scoping a sass mixin.