How to use gulp-svgstore - 7 common examples

export default function sprite() {
  return gulp
    .src(`${configs.paths.src}/icons/**/*.svg`)
    .pipe(rename({ prefix: 'icon-' }))
    .pipe(svgstore({ inlineSvg: true }))
    .pipe(
      through2.obj((file, encoding, callback) => {
        spriteStore.setSprite(file.contents.toString());
        callback(null, file);
      }),
    )
    .pipe(rename({ basename: 'sprite' }))
    .pipe(gulp.dest(`${envPath}/${configs.paths.assets.img}`))
    .on('error', errorHandler);
}

imagemin.svgo({
          plugins: [
            { removeDimensions: true },
            { removeTitle: true },
            { cleanupNumericValues: true },
            { cleanupListOfValues: true },
            { removeViewBox: false },
            { removeRasterImages: true },
            { sortAttrs: true },
            { transformsWithOnePath: true },
          ],
        }),
      ]),
    )
    .pipe(rename({ prefix: 'icon-' }))
    .pipe(svgstore({ inlineSvg: true }))
    .pipe(rename({ basename: 'sprite' }))
    .pipe(gulp.dest('.cache/img'))
    .pipe(gulp.dest(`${envPath}/${configs.paths.assets.img}`))
    .on('error', notifierErrorHandler);
}

'fill-rule',
              'clip-rule',
              'sketch:type',
              'sketch:type',
              'xmlns:sketch',
              'xmlns:xlink'
            ]
          }
        }
        ]
      }
    }))
    .pipe(rename((path) => {
      path.basename = 'icon-' + path.basename;
    }))
    .pipe(svgstore({
      cleanupdefs: true,
      includeTitleElement: false,
      id: 'base-icon-',
      inlineSvg: true
    }))
    .pipe(rename(config.svg_sprite_name))
    .pipe(gulp.dest(config.svg_sprite_path))
}

gulp.task('sprites', () => {
  gulp.src(join(src, 'images', '**/*.svg'))
    .pipe(svgmin())
    .pipe(cheerio({
      run($) { $('[fill]').removeAttr('fill'); },
      parserOptions: { xmlMode: true },
    }))
    .pipe(svgstore({ inlineSvg: true }))
    .pipe(concat('sprites.ejs'))
    .pipe(gulp.dest(join(src, 'html', 'partials')));
});

export default function sprite() {
  return gulp
    .src(`${configs.paths.src}/icons/**/*.svg`)
    .pipe(rename({ prefix: 'icon-' }))
    .pipe(svgstore({ inlineSvg: true }))
    .pipe(
      through2.obj((file, encoding, callback) => {
        spriteStore.setSprite(file.contents.toString());
        callback(null, file);
      }),
    )
    .on('error', errorHandler);
}

.pipe(tap((file, t) => {
      if (file.isDirectory()) {
        let name = file.relative + '.svg'
        gulp.src(file.path + '/**/*.svg')
          .pipe(svgstore({
            fileName: name,
            prefix: 'icon-',
            inlineSvg: true
          }))
          .pipe(gulp.dest(paths.svgs.output))
      }
    }))
    .pipe(svgmin())

gulp.task('svg-sprite', ['svg-fallback'], () => {
  return gulp.src(config.tasks.svgSprite.src)
    .pipe(imagemin())
    .pipe(svgstore())
    .on('error', handleErrors)
    .pipe(gulp.dest(config.dest))
    .pipe(browserSync.stream());
});