rollup-plugin-svg-sprite-deterministic

2.0.0 verified Mon Apr 27 auth: no javascript

A Rollup plugin that creates deterministic external SVG sprite files from imported SVG files, with optimization via SVGO. Current stable version 2.0.0 (Node >=12). This fork of rollup-plugin-svg-sprite ensures repeatable builds by fixing non-deterministic output (e.g., SVG IDs, ordering). Released as needed. Key differentiators: deterministic builds vs original plugin, optional minification, configurable output folder.

Common errors

error Error [ERR_REQUIRE_ESM]: require() of ES Module ↓

cause Using CommonJS require() to import an ESM-only module.

fix

Change to dynamic import: const svgSprite = (await import('rollup-plugin-svg-sprite-deterministic')).default

error TypeError: svgSprite is not a function ↓

cause Incorrect import pattern (named vs default) or missing parentheses.

fix

Ensure correct import: import svgSprite from 'rollup-plugin-svg-sprite-deterministic'

error Error: Could not resolve 'rollup-plugin-svg-sprite-deterministic' ↓

cause Package not installed or not in node_modules.

fix

Run npm install rollup-plugin-svg-sprite-deterministic -D

Warnings

breaking Version 2.x changes the default output behavior: sprite file name may differ from 1.x, and options have been reorganized. See pull request #1. ↓

fix Review configuration options and adjust output folder accordingly. If migrating from 1.x, test output sprite names.

deprecated The 'minify' option defaults to true but SVGO configuration is not customizable in current version. This may change in future releases. ↓

fix If you need custom SVGO options, consider using a separate SVGO plugin after sprite generation, or watch for future updates.

gotcha Plugin is ESM-only and cannot be required() with CommonJS. Using require() in a Node.js script will throw an error. ↓

fix Use dynamic import: const svgSprite = (await import('rollup-plugin-svg-sprite-deterministic')).default

gotcha SVG sprite output is deterministic only when the same set of SVGs is imported in the same order across builds. If file ordering changes (e.g., due to glob resolution), sprite may differ. ↓

fix Ensure consistent import order, e.g., by explicitly listing files or using a deterministic glob plugin.

Install

npm install rollup-plugin-svg-sprite-deterministic

yarn add rollup-plugin-svg-sprite-deterministic

pnpm add rollup-plugin-svg-sprite-deterministic

Imports

default export

wrong

const svgSprite = require('rollup-plugin-svg-sprite-deterministic')

correct

import svgSprite from 'rollup-plugin-svg-sprite-deterministic'

Plugin is ESM-only; CommonJS require() will fail unless using dynamic import or bundler that handles ESM.

named export

wrong

import svgSprite from 'rollup-plugin-svg-sprite-deterministic'

correct

import { svgSprite } from 'rollup-plugin-svg-sprite-deterministic'

Version 2.0.0 exports both default and named; using named import requires destructuring correctly.

TypeScript types
```
import type { RollupPluginSvgSpriteOptions } from 'rollup-plugin-svg-sprite-deterministic'
```
Types are not shipped with the package; you must install @types/rollup-plugin-svg-sprite-deterministic if available or declare manually.

Quickstart

Configures Rollup to create a deterministic SVG sprite from imported SVG files.

// rollup.config.js
import svgSprite from 'rollup-plugin-svg-sprite-deterministic'

export default {
  input: 'src/index.js',
  output: {
    file: 'dist/app.js',
    format: 'iife'
  },
  plugins: [
    svgSprite({
      outputFolder: 'dist/public'
    })
  ]
}

// src/index.js
import './svg/trash.svg'
import './svg/user.svg'