@extend да SASS даги !optional меткаси

Селекторни кенгайтиришда, @extend директиваси тўғри ишламaganда, хатолик юз белиши мумкин. Мисол учун, агар сизда куйидаги код бўлса:

style.scssa.info {
  @extend .main;
}

Агар биронта селектор .main ни ўз ичига олмаса, компиляция жараёнида хатолик юз беради. Бундай ҳолатда биз селекторлар кетма-кетлигини бирлаштиришимиз керак, бунинг учун биз @extend директивасидан фойдаланамиз.

Бундан ташқари, агар селектор ўзида .main ни ўз ичига олган бўлса, масалан: h1.main, хатолик юз беради, бу эса a ва h1 ўртасидаги зиддият билан изоҳланади.

Шунинг учун, зарурат тугӀилганда, сиз @extend директивасига селектордан кейин ёзилган мажбурий бўлмаганлик меткаси !optional орқали янги селекторлар яратишга рухсат бермаслигингиз мумкин. Мисол учун:

style.scssa.info {
  @extend .main !optional;
}