Напишите исходную карту в двух файлах в том же потоке

Question

У меня есть поток, который генерирует два файла CSS: Unminify и minify. Я могу записать исходный файл только в миниатюре.

gulp.task('styles:foehn', ['lint-styles'], function() { 
     var processors = [ 
      require('postcss-import'), 
      require('postcss-mixins'), 
      require('postcss-each'), 
      require('postcss-for'), 
      require('postcss-simple-vars'), 
      require('postcss-custom-media'), 
      require('postcss-custom-properties'), 
      require('postcss-media-minmax'), 
      require('postcss-color-function'), 
      require('postcss-nesting'), 
      require('postcss-nested'), 
      require('postcss-custom-selectors'), 
      require('postcss-property-lookup'), 
      require('postcss-extend'), 
      require('postcss-selector-matches'), 
      require('postcss-selector-not'), 
      require('postcss-hidden'), 
      require('lost'), 
      require('postcss-calc'), 
      require('pixrem')({html: false}), 
      require('postcss-color-rgba-fallback'), 
      require('autoprefixer')({browsers: config.browsers}), 
      require('postcss-class-prefix')('vd-', { 
       ignore: [ 
        /wf-/, // ignore webfontloader classes 
        /is-/ 
       ] 
      }), 
      require('perfectionist') 
     ]; 
     return gulp.src(config.src.styles.foehn) 
      // Start sourcemaps 
      .pipe(sourcemaps.init()) 
      // We always want PostCSS to run 
      .pipe(postcss(processors)) 
      // Set the destination for the CSS file 
      .pipe(gulp.dest(config.dest + '/assets/foehn/styles')) // <--- How to write source map in this file ? 
      // Minify the styles 
      .pipe(nano()) 
      // Write sourcemaps 
      .pipe(sourcemaps.write()) // <------ source map is written in the *.min.css 
      // Rename minified styles file 
      .pipe(rename({ suffix: '.min' })) 
      // Set the destination for the CSS file 
      .pipe(gulp.dest(config.dest + '/assets/foehn/styles')) 
      // If we are in dev, reload the browser 
      .pipe(gulpif(gutil.env.dev, reload({stream:true}))); 
    }); 

спасибо за вашу помощь ...

редактировать

Если бы я писал

.pipe(sourcemaps.init()) 
.pipe(postcss(processors)) 
//.pipe(sourcemaps.write()) 
.pipe(gulp.dest(config.dest + '/assets/foehn/styles')) 
.pipe(nano()) 
.pipe(rename({ suffix: '.min' })) 
.pipe(sourcemaps.write()) 
.pipe(gulp.dest(config.dest + '/assets/foehn/styles')) 

Я получаю Souré карту в *.min.css файлы, но не в *.css файлов ,
Но если я использую

.pipe(sourcemaps.init()) 
.pipe(postcss(processors)) 
.pipe(sourcemaps.write()) 
.pipe(gulp.dest(config.dest + '/assets/foehn/styles')) 
.pipe(nano()) 
.pipe(rename({ suffix: '.min' })) 
.pipe(sourcemaps.write()) 
.pipe(gulp.dest(config.dest + '/assets/foehn/styles')) 

Я получаю следующее сообщение об ошибке:

events.js:154 
     throw er; // Unhandled 'error' event 
    ^
Error: "/node_modules/normalize.css/normalize.css" is not in the SourceMap. 
    at SourceMapConsumer_sourceContentFor [as sourceContentFor] (/Users/cedricaellen/Projects/foehn/node_modules/source-map/lib/source-map-consumer.js:704:13) 
    at SourceMapGenerator.<anonymous> (/Users/cedricaellen/Projects/foehn/node_modules/source-map/lib/source-map-generator.js:235:40) 
    at Array.forEach (native) 
    at SourceMapGenerator_applySourceMap [as applySourceMap] (/Users/cedricaellen/Projects/foehn/node_modules/source-map/lib/source-map-generator.js:234:32) 
    at _class.applyPrevMaps (/Users/cedricaellen/Projects/foehn/node_modules/postcss/lib/map-generator.js:146:22) 
    at _class.generateMap (/Users/cedricaellen/Projects/foehn/node_modules/postcss/lib/map-generator.js:194:46) 
    at _class.generate (/Users/cedricaellen/Projects/foehn/node_modules/postcss/lib/map-generator.js:275:25) 
    at LazyResult.stringify (/Users/cedricaellen/Projects/foehn/node_modules/postcss/lib/lazy-result.js:226:24) 
    at /Users/cedricaellen/Projects/foehn/node_modules/postcss/lib/lazy-result.js:163:27 
    at process._tickCallback (internal/process/next_tick.js:103:7) 

Answer 1

Там нет ничего мешает вам вызова sourcemaps.write() дважды в одном потоке.

.pipe(sourcemaps.init()) 
.pipe(postcss(processors)) 
.pipe(sourcemaps.write()) 
.pipe(gulp.dest(config.dest + '/assets/foehn/styles')) 
.pipe(nano()) 
.pipe(rename({ suffix: '.min' })) 
.pipe(sourcemaps.write()) 
.pipe(gulp.dest(config.dest + '/assets/foehn/styles')) 

Также вы должны позвонить sourcemaps.write() после rename(). В противном случае это преобразование не будет записано в ваших исходных картах, и вы можете увидеть неправильные имена файлов при проверке вашего CSS в браузере.