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.scss到foo/sample.scss.
我发现reworks/css这实际上允许你做一个与我正在寻找的非常相似的行为,但这个要么a)只适用于CSS(不是SCSS)要么b)我找不到要使用的选项,所以它适用于SCSS也是。
还有,node-sass但它只呈现输入到 CSS,没有编程操作选项。
你知道任何可以推荐或指向我的工具吗?一个nodejs基础的工具将是理想的,但我愿意在替代ruby或python。