将两个.less文件合二为一

时间:2014-06-13 12:18:05

标签: css less

假设我减少了两个文件first.less

.a {
  .b {
    font-size: 13px;
  }
  color: lime;
}

second.less

@import "first.less";
.a {
  font-family: sans-serif;
}

我想要一种将它们合并为一种方法,合并树木:

.a {
  .b {
    font-size: 13px;
  }
  color: lime;
  font-family: sans-serif;
}

所以,类似于编译.css,但保持.less结构。是否可以通过命令行工具,库或以编程方式进行?

1 个答案:

答案 0 :(得分:0)

@helderdarocha的意思是,您可以编写本机javascript并使用node.js运行它。 例如,请参阅http://lesscss.org/#using-less-usage-in-codehttp://onedayitwillmake.com/blog/2013/03/compiling-less-from-a-node-js-script/

  1. 安装少用:npm install less(这将创建一个node_modules目录)
  2. 创建您的second.less文件
  3. 创建一个test.js文件,例如:
  4.     var less = require( 'less' );
        var fs = require( 'fs' );
        var parser = new less.Parser();
        fs.readFile( 'second.less', function ( error, data ) {
          var dataString = data.toString();
          parser.parse(dataString, function ( err, tree ) {
            if ( err ) {
              return console.error( err );
            }
            console.log( tree.toCSS() );
          });
        });
    
    1. 现在你可以运行:>> node test.js
    2. 上面将输出CSS代码,而不是您想要的更少代码。要获得所需的结果,您应该使用toLess()函数扩展较少的代码,该函数可以在tree上调用,就像toCSS()一样。我想知道这是否是获得理想结果的最佳方式,您似乎想要的是某种选择器合并。请注意,Less don不合并选择器(请参阅:https://github.com/less/less.js/issues/930)。 也许还可以查看合并选择器的http://css2less.cc/