Reuse Paths
Creates a definition for similar paths, and swaps the <path>
elements to <use>
elements that will reference a single <path>
definition.
It looks for <path>
elements that have the same d
, fill
, and stroke
attribute values, then copies them into a <path>
in the defs
element, creating it if it doesn't exist.
If the path contains other attributes, such as style
or transform
, they will be preserved in the <use>
element that supersedes it.
TIP
If you only need SVG 2 or inline HTML compatibility, it's recommended to include the Remove Xlink plugin towards the end of your pipeline to convert references to xlink:href
to the SVG 2 href
attribute.
Usage
js
module.exports = {
plugins: ["reusePaths"],
};
module.exports = {
plugins: ["reusePaths"],
};