Label !optional dalam @extend di SASS
Saat memperluas selector, Anda mungkin menemukan
error ketika direktif @extend
tidak berjalan dengan benar. Contohnya,
jika Anda memiliki kode berikut:
a.info {
@extend .main;
}
Jika tidak ada selector yang mengandung .main,
maka akan terjadi error saat dikompilasi.
Dalam kasus seperti ini, kita perlu menggabungkan
urutan selector,
untuk itu kita menggunakan direktif @extend.
Selain itu, error akan terjadi jika selector
yang mengandung .main adalah seperti ini:
h1.main, yang dijelaskan oleh konflik
antara a dan h1.
Oleh karena itu, jika diperlukan, Anda dapat
mengizinkan direktif @extend untuk tidak membuat
selector baru dengan label opsional
!optional, ditulis setelah selector. Contoh:
a.info {
@extend .main !optional;
}
