a grunt wrapper around sprites-preprocessor

Usage no npm install needed!

<script type="module">
  import gruntContribSpritesPreprocessor from '';



A grunt wrapper around

The only sprites generator I found, that handles CSS replacement well enough.


        'sprite-preprocessor': {
            options: {
                // generated img name, defaults to 'sprite.png'
                // maps to
                spriteFileName: 'sprite.png',

                // where all the images for the src CSS files live, defaults to 'src/assets'
                // maps to
                srcImagesDir: 'src/assets',

                // a mutual prefix to all the urls in the CSS content
                // maps to
                cssUrlsPrefixedWith: 'assets/',

                // destination directory of the sprite, if 'spriteDestDir' is not specified it defaults to the value of 'srcImagesDir'
                spriteDestDir: 'dist/assets'

                // few general grunt task options

                separator: '', // in case you have more than 1 src css file,
                filter: 'isFile' // or a function
                // see
            files: {
                'dest/style.with.sprites.css': ['src/style.css' /* you can add more, they willl just be concatenated */]


npm install grunt-contrib-sprites-preprocessor
grunt sprites-preprocessor


whatever spritesmith requires, I had to

sudo npm install -g phantomjs

# and
export PKG_CONFIG_PATH=/opt/X11/lib/pkgconfig