Ознака !optional у @extend у SASS-у

При проширивању селектора може се десити грешка када директива @extend није радила коректно. На пример, ако имате следећи код:

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

Ако ниједан селектор не садржи .main, приликом компајлирања ће се десити грешка. У том случају треба да спојимо секвенце селектора, због чега користимо директиву @extend.

Поред тога, грешка ће се десити и ако селектор који садржи .main буде овакав: h1.main, што се објашњава конфликтом између a и h1.

Стога, по потреби, можете дозволити директиви @extend да не креира нове селекторе уз помоћ ознаке опционалности !optional, записане после селектора. На пример:

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