I use Stylus to write CSS and the stylus.url() method to base64 encode all images. My problem is that stylus will also encode one of the fonts. It's only one woff2 font that's being encoded. All other are left as URLs.
How can I ignore the font file or otherwise prevent it from being base64 encoded when using the stylus.url() method.
font.styl:
@font-face {
font-family: 'GillSansMTStd';
src: url('../fonts/2D770A_6_0.eot');
src: local('☺︎'),
url('../fonts/2D770A_6_0.woff2') format('woff2'),
url('../fonts/2D770A_6_0.woff') format('woff'),
url('../fonts/2D770A_6_0.ttf') format('truetype');
}
main.css:
@font-face {
font-family: 'GillSansMTStd';
src: url("../fonts/2D770A_6_0.eot");
src: local('☺︎'),
url("data:application/font-woff2;base64,d09GMgABA[...]") format('woff2'),
url('../fonts/2D770A_6_0.woff') format('woff'),
url('../fonts/2D770A_6_0.ttf') format('truetype');
}
Reading through the sourcecode for stylus.url() I found the mimes option. Which I haven't found documented anywhere. I can set which mime types I want to base64 encode by setting that option:
stylus(str)
.set('filename', __dirname + '/css/test.styl')
.define('url', stylus.url({
mimes: {
'.gif': 'image/gif',
'.png': 'image/png',
'.jpg': 'image/jpeg',
'.jpeg': 'image/jpeg',
'.svg': 'image/svg+xml'
}
}))
.render(function(err, css){
});
Collected from the Internet
Please contact [email protected] to delete if infringement.
Comments