gulp.task('sprites', function () {
sprity.src({
src: '/img/icon/*.png',
style: '_icon.scss',
format: 'png',
orientation: 'left-right',
template: './sprity-css.hbs',
processor: 'scss',
prefix: 'icon',
name: 'icon'
})
.pipe(gulpif('*.png', gulp.dest('/img/'), gulp.dest('/css/')));
sprity.src({
src: topicType + '/img/bg/*.png',
style: '_bg.scss',
format: 'png',
orientation: 'left-right',
template: './sprity-css.hbs',
processor: 'scss',
prefix: 'bg',
name: 'bg'
})
.pipe(gulpif('*.png', gulp.dest('/img/'), gulp.dest('/css/')));
});
最后生成的图片和样式,bg.png和_bg.scss会包含icon文件夹里面的图片和样式,为什么?是因为gulp流的缓存问题吗?怎么解决?
原来是sprity的一个bug,原因好像是sprity会从同一个节点处理多个png流,以致默认的layout成为包罗万象的每一个png图像。
详细可查看我的文章