.svgo.yml

multipass: true

plugins:
  - addAttributesToSVGElement: false
  - addClassesToSVGElement: false
  - cleanupAttrs: true
  - cleanupEnableBackground: true
  - cleanupIDs: true
  - cleanupListOfValues: true
  - cleanupNumericValues:
      floatPrecision: 2
  - collapseGroups: true
  - convertColors: true
  - convertPathData: true
  - convertShapeToPath: true
  - convertStyleToAttrs: true
  - convertTransform: true
  - mergePaths: true
  - minifyStyles: true
  - moveElemsAttrsToGroup: true
  - moveGroupAttrsToElems: true
  - removeAttrs: true
  - removeComments: true
  - removeDesc: true
  - removeDimensions: true
  - removeDoctype: true
  - removeEditorsNSData: true
  - removeElementsByAttr: true
  - removeEmptyAttrs: true
  - removeEmptyContainers: true
  - removeEmptyText: true
  - removeHiddenElems: true
  - removeMetadata: true
  - removeNonInheritableGroupAttrs: true
  - removeRasterImages: true
  - removeStyleElement: true
  - removeTitle: true
  - removeUnknownsAndDefaults: true
  - removeUnusedNS: true
  - removeUselessDefs: true
  - removeUselessStrokeAndFill: true
  - removeViewBox: true
  - removeXMLNS: false
  - removeXMLProcInst: true
  - sortAttrs: true
  - transformsWithOnePath: true

js2svg:
  pretty: true
  indent: '  '

README.md

SVG Tool

Install svg2sprite CLI (global)

npm i -g svg2sprite-cli

Install other packages

npm install

Use

1. npm run svgo
2. npm run svg2sprite

Explain folder structure

./src/assets/images/
  ./icons-src/
  ./icons-optimized/
  ./symbol-defs.svg
./.svgo.yml
./package.json

package.json

{
  "name": "svg-tool",
  "scripts": {
    "svg2sprite": "svg2sprite ./src/assets/images/icons-optimized/ ./src/assets/images/symbol-defs.svg",
    "svgo": "./node_modules/svgo/bin/svgo -f ./src/assets/images/icons-src -o ./src/assets/images/icons-optimized --config .svgo.yml"
  },
  "devDependencies": {
    "svg2sprite-cli": "^2.0.1",
    "svgo": "^1.3.0"
  }
}

some-page.html

<div>
  <svg>
    <use [attr.xlink:href]="'assets/images/symbol-defs.svg#' + 'icon-file-name-without-extension'" style="fill: currentColor;"></use>
  </svg>
</div>