@extend içinde !optional Etiketi SASS'te
Bir seçiciyi genişletirken, @extend direktifi
doğru şekilde çalışmadığında bir hata alabilirsiniz.
Örneğin, aşağıdaki koda sahipseniz:
a.info {
@extend .main;
}
Hiçbir seçici .main içermiyorsa,
derleme sırasında bir hata oluşacaktır.
Böyle bir durumda, seçici dizilerini birleştirmemiz gerekir,
bunun için @extend direktifini kullanırız.
Ayrıca, .main içeren seçici şu şekilde olursa
(h1.main) da hata olacaktır, bu da
a ve h1 arasındaki çakışma ile açıklanır.
Bu nedenle, gerekirse, @extend direktifinin
seçiciden sonra yazılan isteğe bağlılık etiketi
!optional kullanarak yeni seçiciler oluşturmamasına
izin verebilirsiniz. Örneğin:
a.info {
@extend .main !optional;
}
