v3.0.0

SVGO v3

Improvements and fixes

• fixed datauri option when multipass is not enabled
• improved default preset warnings

Breaking channges

• Node.js 14+ is required for version
• stable package is replaced with native stable sort (required node 12+)

Config

Typescript types are exposed out of the box. No longer need to install @types/svgo

// svgo.config.js
/**
 * @type {import('svgo').Config}
 */
export default {
  // svgo configuration
}

Active flag is no longer supported

export default {
  plugins: [
    {
      name: 'removeDoctype',
      active: true
    },
    {
      name: 'removeComments',
      active: false
    }
  ]
}

extendDefaultPlugins is removed, preset-default plugin should be used instead
when need to customize plugins defaults

export default {
  plugins: [
    {
      name: 'preset-default',
      params: {
        overrides: {
          // plugins customization
        }
      }
    }
  ]
}

Enabled sortAttrs plugin by default to get better gzip compression.

<svg>
-  <rect fill-opacity="" stroke="" fill="" stroke-opacity="" />
+  <rect fill="" fill-opacity="" stroke="" stroke-opacity="" />
</svg>

Can be disabled if necessary

export default {
  plugins: [
    {
      name: 'preset-default',
      params: {
        overrides: {
          sortAttrs: false
        }
      }
    }
  ]
}

cleanupIDs plugin is renamed to cleanupIds

export default {
  plugins: [
    'cleanupIds'
  ]
}
// or
export default {
  plugins: [
    {
      name: 'preset-default',
      params: {
        overrides: {
          cleanupIds: {}
        }
      }
    }
  ]
}

Removed cleanupIds plugin "prefix" param, prefixIds should be used instead

export default {
  plugins: [
    'cleanupIds',
    {
      name: 'prefixIds',
      params: {
        prefix: 'my-prefix'
      }
    }
  ]
}

Public API

Removed width and height from optimization result.

const { width, height } = optimize(svg).info

Can be found with custom plugin

let width = null
let height = null
const plugin = {
  name: 'find-size',
  fn: () => {
    return {
      element: {
        enter: (node, parentNode) => {
          if (parentNode.type === 'root') {
            width = node.attributes.width
            height = node.attributes.height
          }
        }
      }
    }
  }
}
optimize(svg, {
  plugins: ['preset-default', plugin]
})

Removed error and modernError from optimization result

const {data, error, modernError } = optimize(svg)

Now all errors are thrown, parsing error can be checked by name

try {
  const { data } = optimize(svg)
} catch (error) {
  if (error.name === 'SvgoParserError') {
    // formatted error
    error.toString()
  } else {
    // runtime error
  }
}

Custom plugins

Removed full, perItem and perItemReverse plugin types.
visitor is the only supported plugin api so plugin.type
is no longer required.

Removed plugin.active flag.

Removed plugin.params used as default params, destructuring with defaults can be used instead

name and fn are only required now

const plugin = {
  name: 'my-custom-plugin',
  fn: (root, params) => {
    const { myParam = true } = params
    return {}
  }
}

Removed createContentItem and JSAPI class from nodes.
All nodes are now plain objects with one exception.
parentNode need to be defined to not break builtin plugins.

const plugin = {
  name: 'my-custom-plugin',
  fn: () => {
    return {
      element: {
        enter: (node) => {
          if (node === 'g') {
            const child = {
              type: 'element',
              name: 'g',
              attributes: {},
              children: []
            }
            Object.defineProperty(child, 'parentNode', {
              writable: true,
              value: node,
            })
            node.children.push(child)
          }
        }
      }
    }
  }
}

Thanks to @istarkov, @boidolr, @deining, @ranman, @mondeja, @liamcmitchell-sc, @rogierslag, @kriskowal, @hugolpz and @TrySound