2013-01-19 3 views
1

단축 : 함수/변수가 아직 정의되지 않은 경우에만 "주문형"파일을 더 적게 가져올 수 있습니까?요청시 필요없는 파일 가져 오기

LONG : 페이지에 대한 내 스타일이 포함 된 파일이 적은 것으로 가정합니다. 그것을 styles.less이라고 부르 자. 또한 5 개의 LESS 파일이 더 있습니다. 모든 사람들은 제네릭 디자인 프리미티브를 포함하고 있습니다. 예를 들어 많은 프로젝트에서 사용하는 정보 상자의 디자인 - 그것이 styles.less으로 병합되지 않은 이유입니다. .infobox {}이라고 가정합시다.
그럼에 .infobox이 없으면 해당 파일을 가져 오기 위해 "시도"할 수 있습니까? 나는 웹 브라우저에서 lessc (노드 용 모듈)와 "on-the-fly"컴파일을 통해 컴파일하는 데 관심이 있습니다.

내 사례가 상황을 충분히 명확히하기를 바랍니다. 그렇지 않은 경우 자유롭게 의견을 말하면 자세한 정보를 제공하기 위해 질문을 편집하겠습니다.

+0

CSS 파일을 컴파일 할 때 문서에 대해 아무 것도 모르기 때문에 명시 적으로 LESS 파일에 정의하거나 포함시키지 않으면'.infobox' 스타일이 필요하다는 것을 알지 못합니다. – cimmanon

+0

그래서 유일한 해결책은 컴파일러를 수동으로 감싸고 모든 디자인 프리미티브를 미리 컴파일하고 컴파일러가 실패 할 경우 추가하려고합니다. –

답변

1

전적으로 자동화 된 방법을 찾을 수 없었습니다. 또한 @import 요청을 줄이거 나 최종 CSS를 줄이거 나 필요없는 항목을로드하지 않기 위해이 기능을 원하는지 여부를 알 수 없습니다.

완전 자동화가 필요하지 않고 생성 된 CSS를 줄이기 위해 노력하고 있으며 원하는 클래스가 너무 많지 않으면 다음과 같이 할 수 있습니다. styles.less 파일

//have at the top of the file some variables set to 0 or 1 if the class 
//is present or absent in that file 
@usesClass-infobox: 0; 

//set up a mixin to load it if NOT in the file 
.setClass-infobox(@set) when (@set = 0) { 
    @import 'infobox.less'; 
} 

//a default mixin to do nothing otherwise 
.setClass-infobox(@set) {} 

//call the mixin 
.setClass-infobox(@usesClass-infobox); 

물론 이것은 실제로 프로세스를 자동화하는 데 도움이되지 않습니다. 결국 .infoboxstyles.less 파일에 없다는 것을 알고 계시다면 추가 믹스를 확인하지 않고 @import을 추가하는 것입니다. 이것이 제공하는 유일한 진정한 가치는 기본적으로 코더에게 "여기에 포함시키지 않으면이 기능을 위해로드 할 수있는 모듈이 있습니다."라고 말해주는 변수 섹션을 설정한다는 것입니다. ? "

다시 말하지만, 이것이 완전히 진행되고 있는지 확실하지 않습니다. 어떤 상황에서는 어떤 사람들에게는 유용 할 수 있으므로 제안했습니다.

+0

흥미 롭습니다, 감사합니다! –

+0

좋아, 아무것도 더 잘 나타나지 않았기 때문에, 나는 당신의 대답을 가장 좋은 것으로 받아 들일 것이다 :-) –