Direktivet !optional i @extend i SASS
När du utökar en selektor kan du få
ett fel om direktivet @extend
inte fungerade korrekt. Till exempel,
om du har följande kod:
a.info {
@extend .main;
}
Om ingen selektor innehåller .main,
kommer ett fel att uppstå vid kompilering.
I så fall behöver vi kombinera
selektorsekvenser,
för vilket vi använder direktivet @extend.
Dessutom kommer ett fel att uppstå om selektorn
som innehåller .main är sådan:
h1.main, vilket förklaras av en konflikt
mellan a och h1.
Så, vid behov, kan du
tillåta direktivet @extend att inte skapa
nya selektorer med hjälp av direktivet för valfrihet
!optional, skrivet efter selektorn. Till exempel:
a.info {
@extend .main !optional;
}