时间戳

首页 > 解决方案 > 如何使用 Sketch 插件导出干净的 SVG，无需遮罩或覆盖。草图 49.3

svg - 如何使用 Sketch 插件导出干净的 SVG，无需遮罩或覆盖。草图 49.3

问题描述

当我将 MSSymbolInstances 导出为 SVG 时，我总是在 SVG 代码中得到这一行。

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

直到我手动编辑上面的填充并将“#1D1F20”更改为“none”，我才能在我的程序中使用 SVG。有没有办法在没有这个特定的填充或遮罩的情况下导出 SVG。

我为此尝试了几种方法：-

  1. 循环遍历所有层，如果它是 mssymbolinstance，则使用新的草图 API 导出草图.export(layer, options).. 这不起作用。

  2. 尝试复制图层将其转换为组，然后使用 group.export 如下所示：

    var duplicates = layers[j].duplicate(); var group = duplicates.detachByReplacingWithGroup(); 组=新草图。组（组）；group.export({ "formats": "svg", output : outputPath, //'use-id-for-name' : true, }); group.remove();

这也不起作用，因为输出 SVG 都具有带有一些填充颜色覆盖的蒙版。

  1. 这种方法与 2 相同。这里我只是在将图层转换为组并导出之前不复制图层，但是这还有其他缺点。-> 首先它会删除符号实例，从而更改草图文档。-> 其次，我必须多次运行它并且经常抛出关于 -[NSNull name]: unrecognized selector sent to instance 0x7fffa6e3ecc0 的错误

请帮忙。

标签： svgsketchapp

解决方案

尝试使用我制作的名为svgood的 npm 包。它删除了defs和g（它们往往包含掩码s）元素并将路径元素浮动到svg的顶层。我有一些使它更有用的计划，但如果我可以添加一些可以使它更好地适合您的用例的东西，请告诉我。

推荐阅读