如何修改gulp stream中的css并保存正确的源地图?

如何修改gulp stream中的css并保存正确的源地图?,gulp,source-maps,Gulp,Source Maps,需要更改gulp stream中的css代码(添加到图像路径?哈希),但不会破坏文件中的源映射。当前无法处理css文件,但sourcemaps已扭曲(未存储以前的原始贴图)。我知道我需要一个插件用于这个乙烯基sourcemaps应用和返工+返工url gulp.src('./source/css/**/*.css') .pipe(sourcemaps.init({loadMaps: true})) .pipe(concat('main.css')) .pipe(autop

需要更改gulp stream中的css代码(添加到图像路径?哈希),但不会破坏文件中的源映射。当前无法处理css文件,但sourcemaps已扭曲(未存储以前的原始贴图)。我知道我需要一个插件用于这个乙烯基sourcemaps应用和返工+返工url

gulp.src('./source/css/**/*.css')
    .pipe(sourcemaps.init({loadMaps: true}))
    .pipe(concat('main.css'))
    .pipe(autoprefixer({
        browsers: ['last 2 versions'],
        cascade: false
    }))
    .pipe(antiCache(fileHashes))
    .pipe(sourcemaps.write())
    .pipe(gulp.dest('./css/'));
其中
filHashes
是json对象
“path/to/image.png”:“a9ecbba8ef”
。函数
antiCache
只需更改URL即可

function antiCache(fileHashes) {
    return through.obj(function (file, encoding, callback) {
    var content = file.contents.toString(),
        options = {};

    if (file.sourceMap) {
        options.outSourceMap = file.relative;
    }

    var mangled = (function() {
        var m = rework(file.contents.toString()).use(reworkUrl(function (url) {
            if (fileHashes.hasOwnProperty(path.basename(url))) {
                return url + '?' + fileHashes[path.basename(url)];
            }
            return url;
        }));
        m = css.stringify(m.obj, { sourcemap: true });
        m.code = new Buffer(m.code));
        return m;
    })();

    file.contents = mangled.code;
    if (file.sourceMap) {
        var map = mangled.map;
        map.file = path.relative(file.base, file.path);
        applySourceMap(file, map);
    }
    this.push(file);
    callback(null, file);
    });
}
请帮忙