обновление
Как уже отмечалось в комментариях @ertrzyiks, вы должны заменить less.parse на less.render для Less v 2.x:
var lessCode = '';
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function(){
if(xmlhttp.status == 200 && xmlhttp.readyState == 4){
var options = {}
lessCode = xmlhttp.responseText;
less.render(lessCode, options, function (error, output) {
if(!error) {
document.getElementById('lesscode').innerHTML = output.css;
}
else document.getElementById('lesscode').innerHTML = '<span style="color:red">' + error + '</span>';
});
}
};
xmlhttp.open("GET","important.less",true);
xmlhttp.send();
см. Также: Как обнаружить и распечатать изменяющиеся переменные LESS
Но так как Less v2:
В браузере less.pageLoadFinished будет обещанием, разрешенным, когда
Меньше закончил свою первоначальную обработку. меньше. обновить и
less.modifyVars также возвращает обещания.
Когда вы компилируете filename.less скомпилированный код CSS был вставлен в тег style с id less:filename, поэтому для получения скомпилированного кода CSS вы также можете использовать:
less.pageLoadFinished.then(
function() {
console.log(document.getElementById('less:filename').innerHTML);
}
);
Обратите внимание, что в последнем примере также применяется скомпилированный код CSS на странице.
- конец обновления
Я ожидал, что возможно выполнить что-то вроде следующего:
<link rel="stylesheet/less" type="text/css" href="important.less">
<script src="less-1.7.3.js" type="text/javascript"></script>
<script>
css = less.tree.toCSS();
console.log(css);
</script>
к сожалению, это не работает, но вы можете использовать следующий код, чтобы получить то, что вы хотите:
<script src="less-1.7.3.js" type="text/javascript"></script>
<script>
var lessCode = '';
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function(){
if(xmlhttp.status == 200 && xmlhttp.readyState == 4){
lessCode = xmlhttp.responseText;
new(less.Parser)().parse(lessCode, function (e, tree) {
document.getElementById('lesscode').innerHTML = tree.toCSS().replace(/\n/g,"<br>");
});
}
};
xmlhttp.open("GET","important.less",true);
xmlhttp.send();
</script>
С в разделе body вашего HTML:
<div id="lesscode"></div>
См. Также: Объединение двух файлов .less в один и Как открыть файл на локальном диске с помощью Javascript?