Using Gulp to create an SVG sprite without compression

问题

I'm attempting to use this plugin on every SVG in a given project.

I believe the default compression or reformatting of the svg's themselves is causing issues however.

For example, I have a standard three bar menu icon:

<?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>

But once it's compressed:

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

Making it impossible for me to do any animation to the different rect items that I could do with it before it was moved into the sprite.

Is there any way to turn off the compression or reformatting?

回答1:

According to the documentation it should be possible to remove svgo from the transformation process via

{
    shape : {
        transform           : []
    }
}

来源：https://stackoverflow.com/questions/38023039/using-gulp-to-create-an-svg-sprite-without-compression