Svgo: Remove xmlns:xlink

[iamdriz]

How do I remove: xmlns:xlink="http://www.w3.org/1999/xlink" from the SVG?

As using: {removeAttrs: { attrs: ['svg:xmlns', 'svg:xmlns:xlink'] }}, doesn't work... only the xmlns is removed.

[GreLI]

Why not xmlns:xlink? What do you mean by “only the xmlns is removed”?

[kevinSuttle]

Was wondering about the same thing.

[iamdriz]

@GreLI @kevinSuttle Because the : is used by this script as an element search it conflicts with attributes that have : in them. So for example I want to remove the attribute: xmlns:xlink from the svg element but because it sees that : it tries to remove xlink from the xmls element which doesn't exist. That make sense?

[GreLI]

No. What did you have? What did you do? And what did you get in result? My guess is that you should run SVGO with {removeAttrs: { attrs: ['xmlns:xlink'] }}, in config.

[iamdriz]

@GreLI That causes it to try and remove an xlink attribute from an <xmlns> element (which doesn't exist!). The problem is that the : colon is used as a prefix to choose which element to apply the search and in this case the attribute itself contains the prefix so confuses SVGO.

[GreLI]

Got it. The plugin API isn't that good really. Any ideas or suggestions?

[anaibol]

removeAttrs: {attrs: '(stroke|xmlns)'}, works

[kevinSuttle]

I wonder if you can escape the : or maybe process them as template literals with backticks.

[joscha]

Found this thread because I had the same problem when transforming an SVG to vdom calls.
The following plugin removes all namespaced attributes:

    {
      removePrefixedAttributes: {
        type: 'perItem',
        fn: (item) => {
          item.eachAttr((attr) => {
            if (attr.prefix && attr.local) {
              item.removeAttr(attr.name);
            }
          });
        },
      },
    }