函数之url()

优质

小牛编辑

135浏览

2023-12-01

内联Data URI图像

Stylus捆绑了一个可选函数，名叫url()，其替换了字面上的url()调用（且使用base64 Data URIs有条件地内联它们）。

示例

通过require('stylus').url该函数本身是可用的，其接受一个options对象，当看到url()时候，返回Stylus内部调用的函数。

.define(name, callback)方法指定了一个可被调用的JavaScript函数。在这种情况下，因为我们图片在./css/images中，我们可以忽视paths选项（默认情况下，会查找相关要呈现的图像文件）。如果愿意，该行为时可以改变的。

stylus(str)
  .set('filename', __dirname + '/css/test.styl')
  .define('url', stylus.url())
  .render(function(err, css){

  });

例如，想象图片在./public/images, 我们想要使用url(images/tobi.png), 我们可以传递paths公共目录。这样，它就成为了向上查找进程的一部分。

同样，如果我们想替换为url(tobi.png), 我们可以传递paths: [__dirname + '/public/images'].

stylus(str)
  .set('filename', __dirname + '/css/test.styl')
  .define('url', stylus.url({ paths: [__dirname + '/public'] }))
  .render(function(err, css){

  });

选项(Options)

limit 大小默认限制30Kb(30000)
paths 图像解析路径