CODEWITHSUNDEEP
svggruntjs
Neda Homa
Neda Homa

Reputation: 4357

grunt task svgmin removes id from symbol tag

I use symbol tag with id in my sag file as it is described in the following link: http://css-tricks.com/svg-symbol-good-choice-icons/

After magnification with grunt task svgmin, all of my ids are removed from my svg file.

My grunt task is as follows:

svgmin: {
    options: {
      plugins: [
        { removeViewBox: false},
        { removeUselessStrokeAndFill: false}, 
        { removeEmptyAttrs: false }
      ]
    },

  dist: {
    files: [{
      expand: true,
      cwd: '<%= yeoman.app %>/images',
      src: '{,*/}*.svg',
      dest: '<%= yeoman.dist %>/images'
    }]
  }
},

Is there any work around for this problem?

Upvotes: 0

Views: 1677

Answers (2)

leoh
leoh

Reputation: 10608

The following works for me. 

svgmin: {
      options: {
        full: true,
        plugins: [
          {cleanupIDs: false},                  // don't remove  ids
          {removeViewBox: false},               // don't remove the viewbox atribute from the SVG
          {removeUselessStrokeAndFill: false},  // don't remove Useless Strokes and Fills
          {removeEmptyAttrs: false}             // don't remove Empty Attributes from the SVG
        ]
      },
      dist: {
        files: [{
          expand: true,
          cwd: '<%= yeoman.app %>/images',
          src: '{,*/}*.svg',
          dest: '<%= yeoman.dist %>/images'
        }]
      }
    }

{cleanupIDs: false} alone won't work as reported at here. The solution was to add full:true as in above mentioned example. I was testing using "grunt-svgmin": "^0.4.0".

Upvotes: 2

Ian
Ian

Reputation: 1

You'll need to set the cleanupIDs plugin to false as this is set to true by default. Just add this after your removeEmptyAttrs line:

{ cleanupIDs: false }

Don't forget the comma after the previous curly brace :)

Here is the full list of SVGO plugins you can disable/enable: https://github.com/svg/svgo/tree/master/plugins

Upvotes: 0

Related Questions