一条大口溪流中的两个Sass源地图

我创建了一个Gulp任务，

styles

，它从Sass文件创建缩小的和非缩小的CSS文件。我还想创建缩小和非缩小的源地图，但是，这似乎不起作用

代码如下：

// Compile Sass, Autoprefix and minify
gulp.task('styles', function() {
  return gulp.src('./assets/scss/**/*.scss')
    .pipe(plumber(function(error) {
            gutil.log(gutil.colors.red(error.message));
            this.emit('end');
    }))
    .pipe(sourcemaps.init()) // Start Sourcemaps
    .pipe(sass())
    .pipe(autoprefixer({
            browsers: ['last 2 versions'],
            cascade: false
        }))
    .pipe(sourcemaps.write('../maps'))    
    .pipe(gulp.dest('./assets/css/')) // Create sourcemap
    .pipe(rename({suffix: '.min'}))
    .pipe(cssnano())
    .pipe(sourcemaps.write('../maps')) // Create minified sourcemap
    .pipe(gulp.dest('./assets/css/'))
});    

目前，这会引发一个错误，并且不会创建缩小的sourcemap。但是，如果删除其中一个sourcemap.write实例，则它完全可以正常工作

---

可以在一个流中创建两个源映射吗？

实现这样的功能怎么样

编辑：我从上面链接的尝试。。我让它运行时没有任何错误

   // Grab our gulp packages
var gulp  = require('gulp'),
    gutil = require('gulp-util'),
    sass = require('gulp-sass'),
    cssnano = require('gulp-cssnano'),
    autoprefixer = require('gulp-autoprefixer'),
    sourcemaps = require('gulp-sourcemaps'),
    jshint = require('gulp-jshint'),
    stylish = require('jshint-stylish'),
    uglify = require('gulp-uglify'),
    concat = require('gulp-concat'),
    rename = require('gulp-rename'),
    plumber = require('gulp-plumber'),
    bower = require('gulp-bower'),
    merge = require('merge-stream'),
    clone = require('gulp-clone'),
    browserSync = require('browser-sync').create(),
    clip = require('gulp-clip-empty-files');

gulp.task('styles', function() {
    var source = gulp.src('./assets/scss/**/*.scss')
        .pipe(plumber(function(error) {
            gutil.log(gutil.colors.red(error.message));
            this.emit('end');
    }))
        .pipe(sass())
        .pipe(sourcemaps.init()) // Start Sourcemaps
        .pipe(autoprefixer({
            browsers: ['last 2 versions'],
            cascade: false
    }));

    var pipe1 = source.pipe(clone())
    .pipe(sourcemaps.write('../maps'))
    .pipe(gulp.dest('./assets/css/')); // Create sourcemap

    var pipe2 = source.pipe(clone())
    .pipe(rename({suffix: '.min'}))
    .pipe(cssnano())
    .pipe(sourcemaps.write('../maps')) // Create minified sourcemap
    .pipe(clip())
    .pipe(gulp.dest('./assets/css/'));

    return merge(pipe1, pipe2);
});

---

如果cimmanon建议您可能不想要缩小源映射，只需删除

.pipe(sourcemaps.write('../maps')) // Create minified sourcemap

从

var pipe2

---

为什么要缩小源地图？这不是违背了缩小的目的吗？sourcemap并没有嵌入到缩小的文件中——它是一个单独的文件。能够看到缩微样式的起源是非常有帮助的。好吧，唯一让我感到困惑的是style.min.css.map比非缩微版本大。。。那是怎么回事？