如何在没有SVG进行Base64编码的情况下使用
Stylus预处理器将SVG数据uri嵌入到CSS中？
像这样：
background: url('data:image/svg+xml;utf8,<svg>[...]</svg>');
而不是这个：
background: url('data:image/svg+xml;base64,PD94bWwg[...]');
Normaly我使用stylus.url()来嵌入图像,但它也会使用Base64编码SVG.
我想使用数据uris而不是外部文件来保存文件请求.我已经意识到Base64编码SVG实际上增加了字节而不是减小大小.
我找不到按原样嵌入SVG的方法.
解决方法
由于我找不到既定的方法来做到这一点,我不得不自己解决.我编写了一个包含stylus.url()的简单节点模块,但是替换了SVG内联的方式.
链接到模块：https://www.npmjs.com/package/stylus-inline-svg
除了一些检查,它基本上这样做：
found = stylus.utils.lookup(url.string,options.paths);
if(!found) return literal;
buf = fs.readFileSync(found);
buf = String(buf)
.replace(/<\?xml(.+?)\?>/,'')
.replace(/^\s+|\s+$/g,'')
.replace(/(\r\n|\n|\r)/gm,'');
return new stylus.nodes.Literal("url('data:image/svg+xml;utf8," + buf + "')");
