компиляция файлов lesscss с помощью phantomJS

hej У меня возникла идея скомпилировать файлы lesscss при создании моего проекта с помощью maven. Глядя на сайт lesscss, можно скомпилировать эти файлы, ссылаясь на них в разделе заголовка html-файла, как это

<link rel="stylesheet/less" type="text/css" href="styles.less">
<script src="less.js" type="text/javascript"></script>

Сценарий фантома может получить доступ к любому файлу на локальном жестком диске, поэтому должна быть возможность перебирать файлы *.less. теперь вопрос в том, как скомпилировать эти файлы и сохранить их обратно с расширением css.

жаль, что командная строка доступна только при установке на ноду (а может я ошибаюсь??)

спасибо за любую подсказку


less phantomjs
person kamiseq    schedule 07.02.2012    source источник

Ответы (2)


arrow_upward
0
arrow_downward

Хорошо, после второй попытки я создал этот скрипт

console.log('*********************************************************************');
console.log('executing script ' + phantom.scriptName);
console.log('phantomJS version ' + phantom.version.major + '.' + phantom.version.minor + '.' + phantom.version.patch);
console.log('*********************************************************************');
console.log('looks for less files under src/main/webapp/* and src/main/resources/*');
console.log('to change this pass root directory as script parameter');
console.log('example Usage: phantomjs-less.js src/main/resources/css');
console.log('*********************************************************************');

var root_directory = null;
if (phantom.args.length !== 0) {
    root_directory = phantom.args[0];
}

console.log('injecting less script');
phantom.injectJs('src/main/webapp/js/less-1.2.2.js');

var parser = new(less.Parser);
var searchLessIn = function(root, fs) {
    console.log('look for less in ' + root);
    if (fs.isDirectory(root)) {
        var files = fs.list(root);
        for (var index  = 2; index < files.length; index ++ ) {
            searchLessIn(root + '/' + files[index], fs);
        }
    } else {
        if (root.substr(-5) === '.less'){
            parseLess(root, fs);
        }
    }
    console.log('exit ' + root);
};

var parseLess = function(file, fs) {
    console.log('parse less file : ' + file);
    var opened = fs.read(file);
    console.log(opened);
    parser.parse(opened, function (err, tree) {
        if (err) { return console.error(err); }
        console.log(tree.toCSS());
    });
};

var fs = require('fs');
console.log('*********************************************************************');
console.log('current root directory =' + fs.workingDirectory);

var root = fs.workingDirectory + '/src/main/webapp/css';
console.log('look for less files under ' + root);

if (!fs.exists(root)) {
    console.log(root + ' directory doesnt exists')
    phantom.exit(1);
}
searchLessIn(root, fs);
phantom.exit(0);

он должен вывести проанализированный css на консоль

person kamiseq    schedule 12.02.2012

arrow_upward
0
arrow_downward

попробуйте плагин lesscss maven https://github.com/marceloverdijk/lesscss-maven-plugin

он использует rhino, поэтому вместо 100 мс это займет 3000 мс, но это работает, и все, что вам нужно сделать, это поместить некоторый xml в pom.xml

person naugtur    schedule 31.01.2013