如何以编程方式操作 SCSS?

Ger*_*ard 5 css ruby python sass node.js

我正在尝试寻找一种工具来解析和操作 SCSS。我需要做的是以编程方式“合并”来自不同来源的两个版本的 SCSS 文件。

用例涉及的文件仅在规则中的声明不同,而不是两个完全不同的 SCSS 文件。

例如,如果我有以下文件:

// foo/sample.scss
$myColor: #fff;
body { background-color: $myColor; margin: 0; }

// bar/sample.scss
$myColor: #ccc;
$black: #000;
body { background-color: $myColor; color: $black; }
Run Code Online (Sandbox Code Playgroud)

拥有一个可以执行以下操作的工具会很酷:

var sass = require('some-sass-parsing-lib'),
  fooFile = sass.parse({source: 'foo/sample.scss', otherOption: 'value'}),
  barFile = sass.parse({source: 'bar/sample.scss', otherOption: 'value'});

function findFooRuleSomehow () {
  // this would be implemented by the developer, not a part of the lib
}

function hasDeclaration (rule, declaration) {
  // return wether `rule` has a declaration `declaration`
}

barFile.stylesheet.rules.forEach(function (barRule) {
  var fooRule = findFooRuleSomehow();

  rule.declarations.forEach(function (barDeclaration) {
    if (!hasDeclaration(fooRule, barDeclaration)) {
      fooRule.declarations.append(declaration);
    }
  });
  // do the same with variables, etc.
});

sass.save(fooFile, 'result/sample.scss');  // produces the updated version of the SASS file (not CSS)
Run Code Online (Sandbox Code Playgroud)

并产生类似的东西:

// result/sample.scss
$myColor: #fff;
$black: #000;
body { background-color: $myColor; color: $black; margin: 0; }
Run Code Online (Sandbox Code Playgroud)

例如,这将允许您仅将新声明合并bar/sample.scssfoo/sample.scss.

我发现reworks/css这实际上允许你做一个与我正在寻找的非常相似的行为,但这个要么a)只适用于CSS(不是SCSS)要么b)我找不到要使用的选项,所以它适用于SCSS也是。

还有,node-sass但它只呈现输入到 CSS,没有编程操作选项。

你知道任何可以推荐或指向我的工具吗?一个nodejs基础的工具将是理想的,但我愿意在替代rubypython