Answer the question
In order to leave comments, you need to log in
Why does SVG break when building a sprite with svg-store?
Hello.
I am using gulp-svgstore to build the svg sprite. Until now, everything was fine, there were no problems with sprites, maybe this is due to the fact that there were no complex icons, but only small unpretentious icons. Okay, to the point.
Here is one of the icons that is not in the sprite yet:
Here is the same icon, only connected from the sprite:
Excerpt from gulpfile.js:
gulp.task("icons", function () {
return gulp.src("./src/icons/*.svg")
.pipe(svgo())
.pipe(cheerio({
run: function ($) {
$("[fill]").removeAttr("fill");
$("[stroke]").removeAttr("stroke");
$("[style]").removeAttr("style");
$("[class]").removeAttr("class");
},
parserOptions: {xmlMode: true}
}))
.pipe(replace(">", ">"))
.pipe(svgstore({
inlineSvg: true
}))
.pipe(cheerio({
run: function ($) {
$("svg").attr("style", "display:none");
},
parserOptions: {xmlMode: true}
}))
.pipe(gulp.dest("build/img"));
});
Answer the question
In order to leave comments, you need to log in
run: function ($) {
$("[fill]").removeAttr("fill");
$("[stroke]").removeAttr("stroke");
$("[style]").removeAttr("style");
$("[class]").removeAttr("class");
}
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question