React'ta CSS modülleri için composes komutu

composes komutu, stillerin bir dosyadan diğerinde yeniden kullanılması için de uygulanabilir.

Önceki derslerde yaptığımız buttons uygulamasına dönelim. Tüm butonlara aynı gölgeleri, imleç stilini ve kalın yazı tipini eklemek istediğimizi varsayalım. Bu stillerin App.module.css dosyasında bulunmasına izin verin. Bu dosyayı açalım ve başına bu stillerle yeni bir beauty sınıfı ekleyelim:

App.module.css.beauty { 
  box-shadow: rgba(50, 50, 50, 0.2) 0 5px 5px 0;
  font-weight: bold;
  cursor: pointer;
}

Butonları stilize etmek için onu uygulayalım. Bunun için Buttons.module.css dosyasını açalım ve common-btn sınıfında değişiklikler yapalım. composes komutuyla bir satır ekleyeceğiz, burada uygulamak istediğimiz beauty sınıfının adını ve bu sınıfın bulunduğu App.module.css dosyasını belirteceğiz:

Buttons.module.css.common-btn {
  composes: beauty from "../App.module.css"; 
  font-size: 16px;
  border-radius: 3px;
}