Question

我通过.define（）定义了一些函数，如：

function sum(a,b){
	return new nodes.Unit((a + b), 'px')
}

//...

.define('sum', sum);

效果很好我可以访问我的.styl文件（例如margin sum(10,5)）

现在我正试图通过javascript传递一个stylus mixin：

function border(color){
	return "border: 1px solid" + color
}

//...

.define('border', border)

div
  border(blue)

应编译为：

div
  border: 1px solid blue

像这样......但令人惊讶的是，它不起作用

你有什么想法吗？

我也尝试过这个但是不知道如何使用：

style.define('border', new stylus.nodes.Function('border', 'color', 'border: 1px solid color'));

Answer 1

你不能只将带有手写笔代码的字符串传递给define，因为Stylus不知道它是一个代码（它会自动将JS字符串强制转换为Stylus字符串）。您应该使用stylus.Parser解析此字符串。例如：

var stylus = require('stylus'),
    fs = require('fs'),
    Parser = stylus.Parser,
    filename = 'test.styl';

stylus(fs.readFileSync(filename, 'utf-8'))
    .set('filename', filename)
    .define('func', function() {
        var parser = new Parser('body { test: 1 + 1 }', { filename: filename });
        return parser.parse();
    }).render(function(err, css) {
        if (err) throw err;
        console.log(css);
    });

但它不是那么有用，因为你不能在这些函数中使用手写笔文件中定义的vars。基本上define仅适用于纯函数（不是返回stylus代码的mixins）。

Stylus通过Javascript API定义mixin

1 个答案: