Исходные карты с использованием gulp, Browserify, reactify, UglifyJS

Question

Я пытаюсь получить исходные карты для своих файлов JavaScript, работающих с Chrome. Проблема с текущим сценарием gulp заключается в том, что исходные карты (созданные Browserify) приводят к уменьшенным версиям файлов.

Например, app.jsx является файлом записи для Browserify, и в нем есть require('a') и require('b'). app.jsx получает браузер, проверяется и угадывается и записывается в app.js, как и ожидалось. Тем не менее, все карты источника ссылки в модуле a и модуля b также минимизированы:

var gulp = require('gulp'), 
    browserify = require('browserify'), 
    watchify = require('watchify'), 
    source = require('vinyl-source-stream'), 
    buffer = require('vinyl-buffer'), 
    bundler; 

bundler = browserify({ 
    entries: '/app.jsx', 
    cache: {}, 
    packageCache: {}, 
    fullPaths: true 
}); 

bundler 
    .transform('reactify'); 
    .transform({ 
     global: true 
    }, 'uglifyify'); 

bundler = watchify(bundler); 
bundler.on('update', function() { 
    return bundler 
     .bundle() 
     .pipe(source('app.js')) 
     .pipe(buffer()) 
     .pipe(gulp.dest('/js')); 
}); 

Любые идеи о том, как получить эту работу?

Answer 1

Похоже, что это проблема с uglifyify (https://github.com/hughsk/uglifyify/issues/16). Кажется, он просто не знает, как создавать исходные карты.

Есть несколько альтернатив:

1. уродовать после пакетирования с gulp-uglify плагиным и gulp-sourcemaps плагина. К сожалению, это немного менее оптимально, так как он не удаляет мертвые require заявления.

2. Создайте отдельные разработки и рассылки сборки. Затем вы можете генерировать исходные карты для своей разработки без уклонения. Ваша сборка распределения может быть очищена без исходных карт.