Convert a set of images into a spritesheet and CSS variables
lite gulp-spritesmith, For the mobile side automatically use retina
run npm install img-spritesmith
sprites = require('img-spritesmith')
sprites({
images: ['a.png', 'b.png'],
imgName: 'logo.png',
cssName: 'logo.css',
imgDest: './output',
cssDest: './output',
}).then(function () {
console.log('Success!');
}).catch(function (err) {
console.log(err);
});
-
params
Object
-
images:
Array
entry images files -
imgDest:
String
output images pathDefault:
'./dist/sprite/'
-
cssDest:
String
output css pathDefault:
'./dist/sprite/'
-
imgName:
String
output images nameDefault:
'sprites.png'
-
cssName:
String
output css pathDefault:
'sprites.css'
-
padding:
Number
spacing between images for spritesmith documentationDefault:
4
-
cssSpritesheetName
String
Prefix to use for all spritesheet variables for spritesheet-templates documentationDefault: ``
-
cssOpts:
Object
Options to pass through to the formatter- functions:
Boolean
- variableNameTransforms:
Defaults:
functions: true, variableNameTransforms: ''
- functions:
-
Other parameters for spritesmith documentation
-
-
return
Promise