@extend-də !optional əlaməti SASS-də

Selektorun genişləndirilməsi zamanı, @extend direktivasının düzgün işləməməsi xətası ilə qarşılaşmaq olar. Məsələn, aşağıdakı koda baxaq:

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

Əgər heç bir selektor .main tərkib etmirsə, kompilyasiya zamanı xəta baş verəcək. Belə bir halda biz selektor ardıcıllıqlarını birləşdirməliyik, bunun üçün isə @extend direktivasından istifadə edirik.

Bundan əlavə, əgər selektor .main tərkib edirsə, məsələn: h1.main, bu da xəta ilə nəticələnəcək, çünki a və h1 arasında ziddiyyət yaranır.

Buna görə də, lazım olduqda, siz @extend direktivasının yeni selektorlar yaratmamasına icazə verə bilərsiniz. Bunun üçün selektordan sonra yazılan !optional (isteğe bağlı) əlamətindən istifadə edin. Məsələn:

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