@ media-common-왜 이것을 사용해야합니까?

Magento 2 lib 설명서에는 다음이 포함되어 있습니다.

@ media-common : true | false- 공통 스타일을 출력할지 여부를 설정합니다. 일부 스타일을 추가 할 때마다 일반적인 스타일의 경우 사용해야합니다

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

질문

이것을 사용하지 않고 Less를 쓰는 것의 차이점은 무엇입니까? 같은 :

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

어떻게 다른 방식으로 컴파일합니까?

body {
    background: blue;
}

styles-l.css 및 styles-m.css로 출력되지 않습니까?

— 벤 크룩
소스

마 젠토 2 다음 모바일 첫 번째 방법 및 @ 미디어 일반적인 = 사실이 베이스 (모바일)이며, 현재에해야 스타일을 정의하도록 설계되었습니다 styles-m.css. 이 선언을 삭제하면 styles-m.css및에 모두 스타일이 출력됩니다 styles-l.css.

— 올가
소스

아 이해가 되네요. 감사합니다. media-common = true 일 때 styles-m.css에만 출력되며 media-common = false 설정은 전혀 사용하지 않는 것과 동일합니까?

— 벤 크룩

예. 실제로 미디어 공통 : false; styles-l.less만 사용 됩니다. 따라서 false일부 사용자 정의 독립형 CSS 파일이 아니라면 누군가 의도적 으로 설정하지 않을 것이라고 생각 합니다. 백엔드 스타일의 경우 @ media-common을 사용 하거나 모든 스타일이 단일 CSS 파일에 있으므로 해당 선언을 삭제하십시오.

— Olga

비 모바일 디스플레이에서 magento adds는 styles-l.less모든 스타일이 styles-m.less여전히 적용되므로 왜 media-common : true 외부의 코드 가 두 파일에 추가됩니까?

— Volvox

@Volvox 정확하게. media-common : true를 사용하지 않기 때문에 스타일이 styles-l.less및 로 모두 출력됩니다 styles-m.less. media-common : true 를 사용하는 동안 style-m으로 스타일을 출력하지만 실제로는 모바일과 데스크탑 모두에 적용됩니다! 확인하기 위해 지금 확인하겠습니다.

— Mohammed Joraid