@vafarulez
Верстаю сайты

Как генерировать спрайты svg через gulp?

Уже есть настроенная сборка спрайтов. Но проблема в том что в иконки встроены стили в теге stylе. Название классов в разных иконках может быть одинаковым. Поэтому как только разные иконки оказываются в одном спрайте то стили переопределяются.
gulp.task('svg-sprite', function () {
    return gulp.src(path.svgSprite + '**/*.svg')
        .pipe(svgspritesheet(
{
    cssPathNoSvg: '../images/svg-sprite/svg-sprite.png',
    cssPathSvg: '../images/svg-sprite/svg-sprite.svg',
    padding: 15,
    pixelBase: 16,
    // positioning: 'packed',
    templateSrc: path.styles + 'templates/_svg-sprite-template.styl',
    templateDest: path.styles + '_svg-sprite.styl',
    units: 'em'
}
        ))
        .pipe(svgmin())
        .pipe(replace('>', '>'))
        .pipe(gulp.dest(path.dist.svgSprite + 'svg-sprite.svg'))
        .pipe(svg2png())
        .pipe(gulp.dest(path.dist.svgSprite + 'svg-sprite.png'))
        .pipe(browserSync.stream());
});
  • Вопрос задан
  • 1145 просмотров
Пригласить эксперта
Ответы на вопрос 1
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы