與和給孩子

Question

類

SCSS @import我知道你可以做一個導入一個類裏面是這樣的：

.my-class 
{ 
    @import "another-file.scss"; 
} 

使得another-file.scss類.foo將編譯到.my-class .foo輸出。

我想要做的是進口，此文件中的所有規則，獲得一定的階級加入他們，像這樣的文件：

.my-class 
{ 
    &@import "another-file.scss"; 
} 

這樣.foo在another-file.scss將編譯爲.my-class.foo在輸出。

我正在構建一組所有共享一個類的組件，因爲它們都是同一個「工具包」的一部分，我希望它們都共享一個表示它們的類，但我不想將它們全部放在同一個文件夾下。

這可能嗎？

謝謝！

Answer 1

要做到這一點，您只需要在要導入的文件中加入&前的選擇器。

例如，如果你要導入以下文件，它會爲.my-class.header，my-class.header.cool和my-class.footer創建規則：

&.header { 
    color: blue; 
    &.cool { 
     font-size: 20px; 
    } 
} 

&.footer { 
    color: blue; 
}