La direttiva !optional in @extend in SASS
Quando si estende un selettore, si può incorrere
in un errore se la direttiva @extend
non funziona correttamente. Ad esempio,
se si ha il seguente codice:
a.info {
@extend .main;
}
Se nessun selettore contiene .main,
si verificherà un errore durante la compilazione.
In tal caso, è necessario unire
le sequenze di selettori,
per cui utilizziamo la direttiva @extend.
Inoltre, si verificherà un errore se il selettore
che contiene .main sarà, ad esempio:
h1.main, il che si spiega con un conflitto
tra a e h1.
Pertanto, se necessario, è possibile
permettete alla direttiva @extend di non creare
nuovi selettori utilizzando la direttiva di opzionalità
!optional, scritta dopo il selettore. Ad esempio:
a.info {
@extend .main !optional;
}