@ media-common - Bunu neden kullanmamız gerekiyor?

Magento 2 lib belgelerinde aşağıdakileri içerir:

@ media-common: true | false - ortak stiller çıktısının verilip verilmeyeceğini ayarlar. Sık kullanılan stiller için her stilini eklemek istediğinizde kullanmalısınız

& when (@media-common = true) {
    your styles
}

Soru

Bunu kullanmakla onsuz daha az yazmak arasındaki fark nedir? Gibi:

& when (@media-common = true) {
    body {
        background: blue;
    }
}

Bu nasıl farklı şekilde derlenir:

body {
    background: blue;
}

Ne olursa olsun styles-l.css ve styles-m.css çıktısı olmayacak mı?

— Ben Crook
kaynak

Magento 2, Mobil İlk yaklaşımı izler ve @ media-common = true , temel (mobil) ve içinde bulunması gereken stilleri tanımlamak için tasarlanmıştır styles-m.css. Eğer düşürürseniz bu beyan stilleri hem çıktılanır styles-m.cssve styles-l.cssdosyaları.

— Olga
kaynak

Ah bu daha mantıklı, teşekkürler. Bu yüzden media-common = true değeri yalnızca styles-m.css dosyasına gönderilir ve media-common = false değerini ayarlamak hiç kullanmamakla aynı mıdır?

— Ben Crook

Evet. Aslında medya ortak: yanlış; styles-l.lessyalnızca kullanılır . Bu yüzden falsebelki bazı özel tek başına css dosyası için belki hiç kimse bunu amaca ayarlayacağını sanmıyorum ? Bu arada Backend stilleri için her ikisini de kullanabilirsiniz: @ media-common veya tüm bildirimleri tek bir css dosyasında olduğu için bu bildirimi bırakabilirsiniz.

— Olga

Mobil olmayan görüntüde magento ekler styles-l.less, bu yüzden tüm stiller styles-m.lesshala geçerlidir, bu yüzden neden medya ortak kodu dışında : true her iki dosyaya eklenir?

— Volvox

@Volvox tam olarak. Çünkü medya ortak kullanılmıyor: true , hem styles-l.lessve hem de stilini çıktılar styles-m.less. Kullanarak iken medya-common: true bunun çıkış tarzı stil m olacak ama aslında hem mobil hem de masaüstü uygulanacaktır! Emin olmak için şimdi kontrol edeceğim.

— Muhammed Joraid