1

clean-css を使用して scss ファイルを縮小し、便利な sourceMap ファイルを取得しようとしています。

私の現在のgulp-taskは次のとおりです。

var gulp = require('gulp'),
    sourcemaps = require('gulp-sourcemaps'),
    sass = require('gulp-sass'),
    through = require('through2');
    CleanCSS = require('clean-css'),
    applySourceMap = require('vinyl-sourcemaps-apply');

var minify = through.obj(
    function minify(file,encoding,callback) {
        // do normal plugin logic
        var result = new CleanCSS({sourceMap:file.sourceMap
            ,target: "./src"}).minify(file.contents.toString());
        console.log(file.sourceMap)
        file.contents = new Buffer(result.styles);

        // apply source map to the chain
        if (file.sourceMap) {
            applySourceMap(file, result.sourceMap.toString());
        }
        this.push(file);
        callback();
    }
);

gulp.task('style', [],function () {
  return gulp.src('./myfile.scss',{cwd: 'src'})
    .pipe(sourcemaps.init())
    .pipe(sass())
    .pipe(minify)
    .pipe(sourcemaps.write('../maps/style',{sourceRoot:'/source/src'}))
    .pipe(gulp.dest('./build/style/'))

});

このセットアップを実行すると、次のエラーが表示されます。

Error: Source map to be applied is missing the "file" property
  at assertProperty (node_modules/vinyl-sourcemaps-apply/index.js:32:13)
  at applySourceMap (node_modules/vinyl-sourcemaps-apply/index.js:11:3)
  at DestroyableTransform.minify [as _transform] (/gulp/tasks/style.js:21:4)
  at DestroyableTransform.Transform._read (/node_modules/through2/node_modules/readable-stream/lib/_stream_transform.js:184:10)
  at DestroyableTransform.Transform._write (/node_modules/through2/node_modules/readable-stream/lib/_stream_transform.js:172:12)
  at doWrite (/node_modules/through2/node_modules/readable-stream/lib/_stream_writable.js:237:10)
  at writeOrBuffer (/node_modules/through2/node_modules/readable-stream/lib/_stream_writable.js:227:5)
  at DestroyableTransform.Writable.write (/node_modules/through2/node_modules/readable-stream/lib/_stream_writable.js:194:11)
  at Stream.ondata (stream.js:51:26)
  at Stream.emit (events.js:95:17)
  at queueData (/node_modules/gulp-sass/node_modules/map-stream/index.js:43:21)
  at next (/node_modules/gulp-sass/node_modules/map-stream/index.js:71:7)
  at /node_modules/gulp-sass/node_modules/map-stream/index.js:85:7
  at handleOutput (/node_modules/gulp-sass/index.js:100:3)
  at opts.success (/node_modules/gulp-sass/index.js:63:7)
  at options.success (/node_modules/gulp-sass/node_modules/node-sass/lib/index.js:164:7)

ダミーのファイル パスを追加する (または でアサーションを削除するnode_modules/vinyl-sourcemaps-apply/index.js:32:13)) と、ソース マップが生成されますが、元のファイル (つまり、gulp-sass がコンパイルした scss ファイル) が認識されず、代わりにすべてのソースが「stdin」仮想にマップされます。ファイル。

clean-cssによって処理されたマップされたソースの場所を認識するにはどうすればよいgulp-sassですか?

4

0 に答える 0