LESS 파일을 CSS로 컴파일하는 방법이 있습니까? (모든 브라우저가 필요하지는 않습니까?)

LESS 사용을 고려하고 있지만 JavaScript가 비활성화되어 있고 CSS를 읽을 수 없으며 사이트가 끔찍한 브라우저를 생각하고 울었습니다.

또한 엔지니어가 수정 할 때마다 한 번만 "컴파일"할 수있을 때 모든 브라우저가 해당 파일을 .css로 "컴파일"하도록 강제합니다.

예. 코딩 할 때 개발 시스템에서 LESS 파일을 CSS로 자동 컴파일하는 앱을 사용할 수 있습니다. 그런 다음 개발이 완료되면 생성 된 CSS 파일을 서버에 업로드하기 만하면됩니다.

• 결정적 시기! Windows 및 Mac 용
• Windows를위한 WinLess
• Mac 용 CodeKit

드래그 앤 드롭으로 SimpLESS를 사용 합니다.

LESS에는 .less 파일을 사전 컴파일 할 수있는 바이너리 (lessc)가 제공됩니다. 당신은 그것을 다음과 같이 사용합니다 :

 $ lessc styles.less > styles.css

그러나 대부분의 사람들 은 LESS 파일이 업데이트 될 때마다 CSS 스타일 시트를 자동으로 다시 컴파일 하기 위해 lessc -wor lessc --watch명령을 사용한다고 생각 합니다. CSS를 축소 할 수도 있습니다 (예 :) lessc -w -x.

편집 : 명확히하기 위해 lessc는 서버 측 설치와 함께 제공됩니다 (즉, node.js 패키지 관리자를 통해 덜 설치하는 경우). 그러나 GitHub에서 수동으로 다운로드 할 수 있습니다 .

lessc는에 있습니다 /bin/lessc. 이것은 (해야 또한 Mac 용 작업) 물론 * nix에서 스크립트 이진의,하지만 거기에 있다 윈도우 바이너리 ( lessc.exe 다른 Windows LESS 컴파일러입니다 점이없는에 기반).

업데이트 :less-watch 자동 컴파일에 사용 합니다.

또는 요즘 많은 개발자들이 grunt빌드 자동화 (컴파일, 축소, 테스트 등)를 처리하는 것과 같은 작업 러너를 사용 합니다. 사용 grunt-contrib-watch, grunt-contrib-less그리고 grunt-contrib-livereload, 당신은 정말 개발 워크 플로우를 간소화 할 수 있습니다.

예를 들어 yo새 웹 프로젝트를 스캐 폴딩 하는 데 사용 하는 경우 LESS / CSS / JS / HTML 파일의 변경 사항을보고 필요한 경우 프로젝트의 필요한 부분을 다시 컴파일하도록 미리 구성되어 있습니다. 간단히 실행 grunt serve하면 수동 컴파일 (LESS / SASS / CoffeeScript) / 코드 축소 / 연결 또는 원시인처럼 브라우저를 수동으로 새로 고칠 걱정없이 코딩 할 수 있습니다 ...

서버에서 CSS로 LESS를 컴파일하는 데는 여러 가지 옵션이 있으며, 선택한 옵션은 나머지 사이트에서 사용하는 내용에 따라 달라질 수 있습니다.

• node.js를 사용하면 원래 lesscs 가 작업을 수행합니다.
• PHP를 사용한다면 lessphp . PHP에서 변수를 전달할 때 약간 쓰레기 API가 있지만 작업을 수행합니다.
• Ruby를 사용하면 SASS 는 LESS가 아니지만 SASS (개인 프로젝트) 사용에서 LESS (작업중 인 PHP 프로젝트)로 전환했을 때 파일 확장자 이외의 차이점을 발견하지 못했습니다. 또한 유용한 mixins 라이브러리 인 COMPASS가 있습니다. LESS와 함께 사용하지는 않았지만 효과가있을 것으로 기대합니다. (LESS는 원래 Ruby 였으므로 아마도 어딘가에 떠있는 오래된 컴파일러가있을 것입니다).
• ASP.Net을 사용하는 경우 .less가 있습니다. 나는 이것을 사용하지 않았으므로 그것이 얼마나 잘 작동하는지 모르겠습니다.
• Java를 사용하는 경우 lesscss4j 는 원본 LESS 및 Java 6의 내장 Rhino 스크립팅 환경으로 컴파일을 마무리합니다.
• Perl을 사용하면 CPAN에 LESSp 모듈이 있습니다.