3

When I export the MSSymbolInstances as SVG I always get this line in the SVG code.

<g id="????/Fill/Gray-3" mask="url(#mask-2)" fill="#6A6A78">

It is not until that I edit the fill above manually and change "#1D1F20" to "none", can I use the SVG in my program. Is there any way to export the SVG without this particular fill or mask.

I have tried several approaches for this :-

  1. Loop through all the layers and if it is a mssymbolinstance then export using the new sketch API sketch.export(layer, options).. This does not work.

  2. Tried to duplicate a layer convert it to a group and then used group.export like what follows:

    var duplicates = layers[j].duplicate(); var group = duplicates.detachByReplacingWithGroup(); group = new sketch.Group(group); group.export({ "formats": "svg", output : outputPath, //'use-id-for-name' : true, }); group.remove();

This also does not work as the output SVGs all have the mask with some fill color overrides.

  1. This approach is the same as 2. Here I just do not duplicate the layer before converting it into a group and exporting, however this has other downfalls. -> first of all it removes the symbol instances and thus the sketch document is changed. -> Secondly, I have to run it multiple times and often throws the error regarding -[NSNull name]: unrecognized selector sent to instance 0x7fffa6e3ecc0

Please Help.

sid
  • 31
  • 5

1 Answers1

0

Try using the npm package I made called svgood. It removes defs and g (which tend to harbour the masks) elements and floats the path element to the top level of the svg. I have some plans for making it more useful but let me know if I can add something that would make it better for your use case.

Brenton Wheeler
  • 64
  • 3