我有一堆SVG资产,我目前正在他们自己的文件中存储我的网站。我想将这些SVG文件用作聚合物中iconset的一部分,所以我可以做<core-icon icon="tubers:potato">
问题是似乎无法说出像
这样的内容<core-iconset-svg id="tubers">
<svg id="potato">
... import svg file here without copy-paste ...
</svg>
</core-iconset-svg>
这实际上意味着我必须获取我的SVG资源并围绕它包装聚合物代码。严格来说,这不是世界末日,但有点烦人(我想将SVG文件视为与框架无关的资源,如字体或PNG资源)。
然而,我发现的另一个问题是,如果我尝试使用这种结构在不同的html文件中定义我的图标:
/tuber-icons
/tuber-icons.html
/potato-icon.html
/parsnip-icon.html
然后在两个icon.html文件中都有一个不同的<core-iconset-svg id="tubers">
,并且在tuber-icons中有<link rel="import">
指令将它们全部绑定在一起,它就失败了。看起来您只能使用任何给定的id值定义单个core-iconset-svg指令。这是有道理的,但这意味着我无法做icon="tubers:potato"
,而是需要为每个图标设置不同的顶级命名空间。
另一种方法是将所有SVG文件连接成一个大文件,但是当涉及到copypasta错误时会感觉更糟,从那以后我最终得到了一个大文件,它也有很多复制品SVG指令,每个指令都需要轻微按摩以适应聚合物过程。
所以,回到问题:有没有合理的方法将我作为静态资源的现有SVG指令导入聚合物core-iconset-svg指令?