Skip to content

Instantly share code, notes, and snippets.

@mykhailo-petrenko
Created May 16, 2018 09:42
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save mykhailo-petrenko/080e146cd52289c6d0fc389da8b18113 to your computer and use it in GitHub Desktop.
Save mykhailo-petrenko/080e146cd52289c6d0fc389da8b18113 to your computer and use it in GitHub Desktop.
Sprite generation
// npm install -D glob spritesmith spritesheet-templates
const fs = require('fs');
const glob = require('glob');
const Spritesmith = require('spritesmith');
const templater = require('spritesheet-templates');
const icons = glob.sync('./src/icons/*.png');
const spritePath = `${__dirname}/sprite.png`;
const spriteRelativePath = `/sprite.png`;
const scssPath = `${__dirname}/sprite.scss`;
Spritesmith.run({
src: icons,
}, function(err, result) {
if (err) {
console.error(err);
process.exit(1);
}
const {coordinates, properties, image} = result;
const sprites = [];
Object.keys(coordinates).forEach((path) => {
let name = path.split('/').pop();
name = name.replace(/\..*$/, '');
sprites.push({
...coordinates[path],
name
});
});
fs.writeFileSync(spritePath, image);
const scss = templater({
sprites: sprites,
spritesheet: {
...properties,
image: spriteRelativePath
}
}, {
format: 'scss'
});
fs.writeFileSync(scssPath, scss);
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment