gulp-css-spriter 将css代码中的切片图片合并成雪碧图

    minifyCSS = require(‘gulp-minify-css‘),
    spriter = require(‘gulp-css-spriter‘);

gulp.task(‘css‘, function() {

    var timestamp = +new Date();
    //需要自动合并雪碧图的样式文件
    return gulp.src(‘./src/css/style.css‘)
        .pipe(spriter({
            // 生成的spriter的位置
            ‘spriteSheet‘: ‘./dist/images/sprite‘+timestamp+‘.png‘,
            // 生成样式文件图片引用地址的路径
            // 如下将生产：backgound:url(../images/sprite20324232.png)
            ‘pathToSpriteSheetFromCSS‘: ‘../images/sprite‘+timestamp+‘.png‘
        }))
        .pipe(minifyCSS())
        //产出路径
        .pipe(gulp.dest(‘./dist‘));
});

                if(transformedDeclaration.property === ‘background-image‘ && /\?__spriter/i.test(transformedDeclaration.value)) {

                    transformedDeclaration.value = transformedDeclaration.value.replace(‘?__spriter‘,‘‘);
                    return cb(transformedDeclaration, declarationIndex, declarations);
                }
                // Background is a shorthand property so make sure `url()` is in there 且判断url是否有?__spriter后缀
                else if(transformedDeclaration.property === ‘background‘ && /\?__spriter/i.test(transformedDeclaration.value)) {

                    transformedDeclaration.value = transformedDeclaration.value.replace(‘?__spriter‘,‘‘);
                    var hasImageValue = spriterUtil.backgroundURLRegex.test(transformedDeclaration.value);

                    if(hasImageValue) {
                        return cb(transformedDeclaration, declarationIndex, declarations);
                    }
                }