var gulp = require('gulp');
var spritesmith = require('gulp.spritesmith');
gulp.task('sprites',function(){
gulp.src('img/*.png')//要打包的图片目录
.pipe(spritesmith({
imgName:'sprite.png',//输出的雪碧图名称
cssName:'sprite.css'//输出的CSS名称
}))
.pipe(gulp.dest('build'))//输出的路径，相对于该gulpfile.js文件
});
gulp.task('default',function(){
gulp.run('sprites');
});
1、gulp安装，自行解决。
2、本地创建Demo项目，创建一个img文件夹，把img文件放入即可，创建gulpfile.js文件，内容如图。
3、DOS到当前项目文件下，输入命令：npm install gulp --save-dev及npm install gulp.spritesmith --save-dev，安装gulp及雪碧图插件。
4、初始化项目，DOS命令输入：npm init ，一路回车生成package.json文件。项目结构目录如下：
5、执行 gulp命令,打包生成build目录，包含CSS文件及雪碧图图片文件。
6、若以下报错，则确认图片是否都是PNG格式，不能直接把图片的后缀名改为PNG，而需要保存图片为PNG格式。
