Zachowywanie sourcemaps podczas łączenia strumieni JS (w celu uzyskania zależności konkatlacji z pakietem przeglądarki)

Question

W bieżącym przepływie pracy potrzebuję utworzyć pakiety przeglądania, ale także chcę dołączyć biblioteki nie będące zwykłymi js do początku pliku, aby odsłonić zmienne globalne, ale również zmniejszyć liczbę żądań http i rozmiar plików js. (Niektóre z tych bibliotek mogą być również potrzebne w innych pakietach)

Mam obecnie zadanie "gulp", które tworzy pakiet przeglądarki i zawiera wszystkie wymagane biblioteki na początku pliku wyjściowego, jednak znajduję je w punkcie scalania strumieni, moje sourcemapy się psują, a także w inspektorze sieci; wynikowa mapa pokazuje tylko wstępnie podbijany pakiet przeglądarki, a nie poszczególne moduły js.

var gulp   = require("gulp"), 
buffer   = require('vinyl-buffer'), 
gulpif   = require("gulp-if"), 
sourcemaps  = require("gulp-sourcemaps"), 
merge    = require('merge-stream'), 
concat   = require('gulp-concat'), 
uglify   = require("gulp-uglify") 
livereload  = require("gulp-livereload"); 

// compile scripts 
gulp.task("scripts", function() { 
    "use strict"; 

    // Iterate over bundles 
    var tasks = config.browserifyBundles.map(function(item){ 

    // Use entry file for output file name 
    var outputName = item.mainfile.replace(/^.*[\\\/]/, ''); 
    var browserifyStream = browserify({ 
     entries: item.mainfile, 
     debug: env !== "production" 
    }).bundle() 
    .on("error", notify.onError()) 
    .pipe(source(outputName)) 
    .pipe(buffer()) 
    .pipe(gulpif(env !== "production", sourcemaps.init())) 
    .pipe(gulpif(env !== "production", sourcemaps.write())); 

    // Get files to concat stream from json array 
    var libStream = gulp.src(item.concat); 

    return merge(libStream, browserifyStream) 
     .pipe(gulpif(env !== "production", sourcemaps.init({loadMaps: true}))) 
     .pipe(concat(outputName)) 
     .pipe(uglify()) 
     .pipe(gulpif(env !== "production", sourcemaps.write())) 
     .pipe(gulp.dest(config.projectDir + "js/")) 
     .pipe(notify("updated")) 
     .pipe(livereload()); 
    }); 


    // create a merged stream 
    es.merge.apply(null, tasks); 
}); 

(zauważ, że moim zadaniem czyta także config json tablicę zbudować kilka wiązek, jeśli więcej niż jeden jest obecny)

Czy istnieje sposób mogę zachować sourcemaps ze wstępnie połączonych strumieni? loadmaps ustawione na true nie działa.

Również, jako kontrola zdrowego rozsądku, czy moje podejście byłoby uważane za rozsądne? Czy brakuje mi jakiegoś obłędnie prostszego sposobu osiągnięcia pożądanego rezultatu?

Answer 1

Upewnij się, że następująca linia znajduje się na początku rury, to powinno zachować poprawność sourcemaps.

.pipe(gulpif(env !== "production", sourcemaps.init()))