使用xml-js时无法维持SVG元素的顺序

问题描述

我正在使用xml-js包将XML转换为JS。我遇到的问题是元素的顺序未得到维护。如果您要提供以下内容 https://github.com/Media24si/purge-svg/blob/master/src/index.js#L142以下XML:

<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><symbol id="icon-card-cash-expenses-v2" viewBox="0 0 48 48"><path d="M24 48c13.255 0 24-10.745 24-24S37.255 0 24 0 0 10.745 0 24s10.745 24 24 24z"/><path d="M24 44c11.046 0 20-8.954 20-20S35.046 4 24 4 4 12.954 4 24s8.954 20 20 20z" fill="currentColor"/><path d="M23.5 32a7.5 7.5 0 100-15 7.5 7.5 0 000 15z" fill="currentColor"/><rect x="10" y="15" width="28" height="18" rx="1" fill="#fff"/><circle cx="24" cy="24" r="8" fill="currentColor"/><path d="M21 27.135s1.364.865 3.273.865c1.09 0 2.727-.432 2.727-1.73 0-1.08-.936-1.56-3-2.378l-1.09-.433c-1.092-.432-1.364-1.08-1.364-1.73 0-.78.818-1.729 2.727-1.729 1.309 0 2.363.577 2.727.865" stroke="#fff" stroke-width="1.5" fill="transparent"/><path d="M24 20v-2M24 30v-2" stroke="#fff" stroke-width="1.5"/></symbol>

将不保持SVG元素的顺序,这会破坏图标。这将被退回

  <symbol id="icon-card-cash-expenses-v2" viewBox="0 0 48 48">
    <path d="M24 48c13.255 0 24-10.745 24-24S37.255 0 24 0 0 10.745 0 24s10.745 24 24 24z"/>
    <path d="M24 44c11.046 0 20-8.954 20-20S35.046 4 24 4 4 12.954 4 24s8.954 20 20 20z" fill="currentColor"/>
    <path d="M23.5 32a7.5 7.5 0 100-15 7.5 7.5 0 000 15z" fill="currentColor"/>
    <path d="M21 27.135s1.364.865 3.273.865c1.09 0 2.727-.432 2.727-1.73 0-1.08-.936-1.56-3-2.378l-1.09-.433c-1.092-.432-1.364-1.08-1.364-1.73 0-.78.818-1.729 2.727-1.729 1.309 0 2.363.577 2.727.865" stroke="#fff" stroke-width="1.5" fill="transparent"/>
    <path d="M24 20v-2M24 30v-2" stroke="#fff" stroke-width="1.5"/>
    <rect x="10" y="15" width="28" height="18" rx="1" fill="#fff"/>
    <circle cx="24" cy="24" r="8" fill="currentColor"/>
  </symbol>

调用xml2js时如何保持SVG元素的顺序

    const svg = xml2js(fs.readFileSync(svgObj.in,'utf8'),{ compact: true })

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)