Lemme, слушай а ты класссную тему придумал как эту штуку вообще прозрачно использовать))) ща гайд напишу) красава
Короче прблема в том что если в стайлесе мы потом напишем
.ololo
background-image url(svg-remove)
background-color blue
.trololo
background-image url(svg-remove)
.fdd
background-image url(svg-remove)
.jfg
background-image url(svg-remove)
то он 4 раза дублирует svg код а нам этого не хочется. такой css файл конечно хорошо сожмется гзипом, но все ровно будет тратиться больше времени на парсинг, а это не приятино), по этому файл который выплевывает stylus можно програть через плагин gulp-cssmin который сгруппирует данную конструкцию в
.fdd, .gfdgdf, .gfdgdff, .jfg, .ololo, .oooo, .trololo {
background-image: url(data...)
}
.ololo {
background-color: blue
}
красота ^__^
то есть теперь мы используем совершенно прозрачно данные спрайты будто бы это ссылки на svg картинки, красава)
вообще эту тему можно развить, он будет брать все картинки и смотреть, если меньше 5 килобайт то инлайнить её, если больше то не инлайнить а файлом сохранять, будет смотреть svg меньше в png весит или в svg, а тебе выдавать просто переменные в стайлус. а что в них будет желать, ссылка на реальный файл или dataurl тебя волновать не будет совершенно, плагин все возьмет на себя)))))))))))
щас запилю, отличная идея!!!!!
То есть мы будем писать типа
.ololo
background-image url(filename-png)
.trololo
background-image url(filename2-svg)
а он уже сам будет туда либо ссылку вставлять либо инлайн версию)) а
cssmin все потом сожмет чтобы не дублировалось )!!! гениально!!