使用Gulp创建一个没有压缩的SVG精灵

时间:2016-06-24 22:37:33

标签: svg gulp sprite

我正在尝试在给定项目中的每个SVG上使用this插件。

我认为svg本身的默认压缩或重新格式化会导致问题。

例如,我有一个标准的三栏菜单图标:

<?xml version="1.0" encoding="UTF-8" standalone="no"?> <svg width="200px" height="180px" viewBox="0 0 200 180" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="Artboard-1" fill="#D8D8D8"> <rect id="Rectangle-1" x="0" y="0" width="200" height="40"></rect> <rect id="Rectangle-1" x="0" y="70" width="200" height="40"></rect> <rect id="Rectangle-1" x="0" y="140" width="200" height="40"></rect> </g> </g> </svg>

但是一旦它被压缩了:

<symbol id="menu" viewBox="0 0 200 180"> <g fill="#D8D8D8" fill-rule="evenodd"><path d="M0 0h200v40H0zM0 70h200v40H0zM0 140h200v40H0z"/></g> </symbol>

让我无法对移动到精灵中之前我可以用它做的不同矩形项做任何动画。

有没有办法关闭压缩或重新格式化?

1 个答案:

答案 0 :(得分:0)

根据the documentation,应该可以通过

从转换过程中删除svgo
{
    shape : {
        transform           : []
    }
}