Question

我有带有该代码的Stylus文件：

body
  background url('/templates/main/img/sprites/ico-soc.png') 100px 100px no-repeat

我需要功能（mixin）background，它会删除＆＃39; / templates / main /＆＃39;从图像的参考

body
      background url('img/sprites/ico-soc.png') 100px 100px no-repeat

请帮助我）我想也许我走错了方向，有一个简单的方法来解决问题。请注意，我需要这个功能。不要为目录创建变量！

这就是我正在做的事情

我做了功能

background()
  background arguments

然后我试图以两种方式解决问题 1）我试图找到替换功能。但失败了。然后我尝试使用文档的决定（函数替换）。但它不适合我的情况。 http://learnboost.github.io/stylus/docs/bifs.html#add-propertyname-expr

2）我通过函数use（path）（http://learnboost.github.io/stylus/docs/bifs.html#usepath）在js上编写了我的函数。但我遇到的问题是进入js函数的值不正确。还有额外的空间。

style.styl

use("add.js")

background()
  background arguments

body
  background url('img/sprites/ico-soc.png') 100px 100px no-repeat

add.js

    var plugin = function(){
    return function(style){
        style.define('add', function(a) {
            console.log(typeof a);
            console.log(a);
        });
    };
};
module.exports = plugin;

Answer 1

您可以重新定义url功能，并使用background检查是否从current-property调用了该功能。例如：

url(str)
  if current-property && current-property[0] == 'background'
    str = replace('/templates/main/', '', str)

  return unquote('url(' + str + ')')

body
  background: url('/templates/main/img/sprites/ico-soc.png') 100px 100px no-repeat

编译为：

body {
  background: url(img/sprites/ico-soc.png) 100px 100px no-repeat;
}

替换手写笔中的功能

1 个答案: