자바스크립트 표현식 인식하기

.less 파일 안에서 자바스크립트 표현식들을 변수값으로 인식하게 할 수 있습니다. 이것은 백틱 기호 (`)로 자바스크립트 표현식을 둘러싸면 됩니다.

@var: `"hello".toUpperCase() + '!'`;

위 표현은 아래와 같이 됩니다:

@var: "HELLO!";

문자열을 치환자 ({ } 로 둘러싸기 - 역자 주)와 이스케이프 기호 (~ 기호 - 역자 주)를 써서 바꿀 수도 있습니다.

@str: "hello";
@var: ~`"@{str}".toUpperCase() + '!'`;

위 표현은 아래와 같이 됩니다:

@var: HELLO!;

또한 자바스크립트 속성값에 직접 접근할 수도 있습니다:

@height: `document.body.clientHeight`;

만약 자바스크립트 문자열을 HEX 색상값으로 변환시키고 싶다면 color 함수를 쓰면 됩니다:

@color: color(`window.colors.baseColor`);
@darkcolor: darken(@color, 10%);