example/
├─ Gruntfile.js
├─ sprites/
│ ├─ backward/
│ │ ├─ backward-0.png
│ │ ├─ backward-1.png
│ │ ├─ backward-2.png
│ │ ├─ backward-3.png
│ │ ├─ backward-4.png
│ │ ├─ backward-5.png
│ │ ├─ backward-6.png
│ │ └─ backward-7.png
│ └─ forward/
│ ├─ forward-0.png
│ ├─ forward-1.png
│ ├─ forward-2.png
│ ├─ forward-3.png
│ ├─ forward-4.png
│ ├─ forward-5.png
│ ├─ forward-6.png
│ └─ forward-7.png
└─ result/
├─ growing/
│ ├─ backward.png
│ └─ forward.png
├─ horizontal/
│ ├─ backward.png
│ └─ forward.png
├─ growing-json.json
├─ growing-less.less
└─ horizontal-anim.less
module . exports = function ( grunt ) {
grunt . loadNpmTasks ( 'grunt-sprite-builder' ) ;
grunt . initConfig ( {
'sprite-builder' : {
growing : {
options : {
method : 'growing' ,
cache : false ,
hashname : false ,
templates : {
json : './result/growing-json.json' ,
less : './result/growing-less.less'
}
} ,
src : './sprites/*/' ,
dest : './result/growing/'
} ,
horizontal : {
options : {
method : 'horizontal' ,
trim : false ,
cache : false ,
hashname : false ,
templates : {
anim : './result/horizontal-anim.less'
}
} ,
src : './sprites/*/' ,
dest : './result/horizontal/'
}
}
} ) ;
} ;
result/growing/backward.png
result/growing/forward.png
Метод horizontal
без обрезания краев
result/horizontal/backward.png
result/horizontal/forward.png