Merge ad7123b into d1bf430

svg-sprite · Aug 14, 2021 · e3a9c74 · e3a9c74
2 parents d1bf430 + ad7123b
commit e3a9c74
Show file tree

Hide file tree

Showing 5 changed files with 63 additions and 28 deletions.
diff --git a/docs/configuration.md b/docs/configuration.md
@@ -173,14 +173,19 @@ To call a pre-defined transformation with custom configuration options, use its
 // SVGO transformation with custom plugin configuration
 {
     shape: {
-        transform: [
-            {svgo: {
-                plugins: [
-                    {convertShapeToPath: false},
-                    {moveGroupAttrsToElems: false}
-                ]
-            }}
-        ]
+        transform: [{
+            svgo: {
+                plugins: [{
+                    name: 'preset-default',
+                    params: {
+                        overrides: {
+                            convertShapeToPath: false,
+                            moveGroupAttrsToElems: false
+                        }
+                    }
+                }]
+            }
+        }]
         /* ... */
     }
 }
@@ -237,7 +242,7 @@ Property                 | Type            | Default       | Description
 ------------------------ | --------------- | ------------- | ------------------------------------------ |
 `svg.xmlDeclaration`         | Boolean∣String  | `true`        | Output an XML declaration at the very beginning of each compiled sprite. If you provide a non-empty string here, it will be used one-to-one as declaration (e.g. `<?xml version="1.0" encoding="utf-8"?>`). If you set this to `TRUE`, *svg-sprite* will look at the registered shapes for an XML declaration and use the first one it can find. |
 `svg.doctypeDeclaration`     | Boolean∣String  | `true`        | Include a `<DOCTYPE>` declaration in each compiled sprite. If you provide a non-empty string here, it will be used one-to-one as declaration (e.g. `<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1 Basic//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11-basic.dtd">`). If you set this to `TRUE`, *svg-sprite* will look at the registered shapes for a DOCTYPE declaration and use the first one it can find. |
-`svg.namespaceIDs`           | Boolean         | `true`        | In order to avoid ID clashes, the default behavior is to namespace all IDs in the source SVGs before compiling them into a sprite. Each ID is prepended with a unique string. In some situations, it might be desirable to disable ID namespacing, e.g. when you want to script the resulting sprite. Just set `svg.namespaceIDs` to `FALSE` then and be aware that you might also want to disable SVGO's ID minification (`shape.transform.svgo.plugins: [{cleanupIDs: false}]`). |
+`svg.namespaceIDs`           | Boolean         | `true`        | In order to avoid ID clashes, the default behavior is to namespace all IDs in the source SVGs before compiling them into a sprite. Each ID is prepended with a unique string. In some situations, it might be desirable to disable ID namespacing, e.g. when you want to script the resulting sprite. Just set `svg.namespaceIDs` to `FALSE` then and be aware that you might also want to disable SVGO's ID minification (`shape.transform.svgo.plugins.params.overrides: {cleanupIDs: false}`). |
 `svg.namespaceIDPrefix`           | String         |         | Under some circumstances, the automatically generated ID namespaces might interfere with external scripts (e.g. see [this issue](namespaceIDPrefix) for a problem detected with Google Analytics). In these situations it might be helpful to prefix all IDs with a custom prefix set with this option. |
 `svg.namespaceClassnames`    | Boolean         | `true`        | In order to avoid CSS class name ambiguities, the default behavior is to namespace CSS class names in the source SVGs before compiling them into a sprite. Each class name is prepended with a unique string. Disable this option to keep the class names untouched. |
 `svg.dimensionAttributes`    | Boolean         | `true`        | If truthy, `width` and `height` attributes will be set on the sprite's `<svg>` element (where applicable). |

diff --git a/example.js b/example.js
@@ -11,7 +11,34 @@ const files = glob.sync('**/weather*.svg', { cwd });
 
 const spriter = new SVGSpriter({
     dest,
-    log: 'debug'
+    log: 'debug',
+    shape: {
+        transform: [{
+            svgo: {
+                multipass: true,
+                plugins: [{
+                    name: 'preset-default',
+                    params: {
+                        overrides: {
+                            cleanupListOfValues: true,
+                            removeAttrs: {
+                                attrs: [
+                                    'data-name',
+                                    'fill',
+                                    'clip-rule'
+                                ]
+                            },
+                            removeUnknownsAndDefaults: {
+                                keepRoleAttr: true
+                            },
+                            removeViewBox: false,
+                            sortAttrs: true
+                        }
+                    }
+                }]
+            }
+        }]
+    }
 });
 
 /**

diff --git a/lib/svg-sprite/transform/svgo.js b/lib/svg-sprite/transform/svgo.js
@@ -23,17 +23,18 @@ const pretty = require('prettysize');
  * @param {Function} cb                   Callback
  */
 module.exports = function(shape, config, spriter, cb) {
+    const defaultPluginsConfig = [{
+        name: 'preset-default',
+        params: {
+            overrides: {
+                removeXMLProcInst: Boolean(spriter.config.svg.xmlDeclaration),
+                removeDoctype: Boolean(spriter.config.svg.doctypeDeclaration)
+            }
+        }
+    }];
+
     config = _.cloneDeep(config);
-    config.plugins = 'plugins' in config ? config.plugins : [];
-    config.plugins.push({
-        name: 'removeXMLProcInst',
-        active: Boolean(spriter.config.svg.xmlDeclaration)
-    }, {
-        name: 'removeDoctype',
-        active: Boolean(spriter.config.svg.doctypeDeclaration)
-    });
-
-    config.plugins = svgo.extendDefaultPlugins(config.plugins);
+    config.plugins = 'plugins' in config ? config.plugins : defaultPluginsConfig;
 
     const svg = shape.getSVG(false);
     const svgLength = svg.length;

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -44,7 +44,7 @@
     "mustache": "^4.2.0",
     "phantomjs-prebuilt": "^2.1.16",
     "prettysize": "^2.0.0",
-    "svgo": "^2.3.1",
+    "svgo": "^2.4.0",
     "vinyl": "^2.2.1",
     "winston": "^3.3.3",
     "xmldom": "^0.6.0",