2015-12-28 3 views
2

Я использую gulp для связывания браузера + babelify с помощью uglifyjs. O Однако исходные файлы, созданные из моего проекта, дают мне комплектную версию, а не комплектную версию.Как получить исходные коды для gulp + babel + browsify + uglify

Вот мои настройки:

var gulp  = require('gulp'), 
    source  = require('vinyl-source-stream'), 
    browserify = require('browserify'), 
    gutil  = require('gulp-util'), 
    buffer  = require('vinyl-buffer'), 
    sourcemaps = require('gulp-sourcemaps'), 
    uglify  = require('gulp-uglify'), 
    file  = 'index.js'; 

gulp.task('build', function(){ 
    return browserify({ 
     entries: [file], 
     transform: ["babelify"] 
     }) 
    .bundle() 
    .pipe(source(file)) 
    .pipe(buffer()) 
    .pipe(sourcemaps.init({loadMaps: true})) 
    .pipe(uglify()) 
    .pipe(sourcemaps.write('./')) 
    .pipe(gulp.dest('./public/js')) 
    .pipe(gutil.noop()) 
}) 

Есть ли способ для меня, чтобы создать сборку, что пучки столпотворение => browserify => уродовать и еще вернуть мне карты в моих предварительно Бабель файлов?

Я также не возражаю против использования глотки (я действительно предпочитаю хрюкать, но эта настройка использовалась для меня в прошлом).

+1

Hi , Почему 'gutil.noop()' в конце? – JiDai

ответ

8

Прежде всего вам необходимо установить browserify для создания карт источников, установив опцию отладки для истинно, если вы хотите предварительно источник babelify карты вам необходимо настроить babelify для создания карт источников:

var gulp  = require('gulp'), 
    source  = require('vinyl-source-stream'), 
    browserify = require('browserify'), 
    gutil  = require('gulp-util'), 
    buffer  = require('vinyl-buffer'), 
    sourcemaps = require('gulp-sourcemaps'), 
    uglify  = require('gulp-uglify'), 
    babelify = require('babelify') 
    file  = 'index.js'; 

gulp.task('build', function(){ 
    return browserify(file,{debug:true}).transform(babelify, {presets: ["es2015", "react"],sourceMaps:true}) 
    .bundle() 
    .pipe(source(file)) 
    .pipe(buffer()) 
    .pipe(sourcemaps.init({loadMaps: true})) 
    .pipe(uglify()) 
    .pipe(sourcemaps.write('./')) 
    .pipe(gulp.dest('./build/js')) 
    .pipe(gutil.noop()) 
}) 
+1

Я сделал это, но я не могу поставить точки останова в хром-отладчике на некоторых строках. В основном на линиях, которые не ограничены функцией. Какие-нибудь советы для этого? – Luka

+0

Вы только что спасли мое здравомыслие, спасибо! – magritte

+2

Я обнаружил, что передача '{compress: false}' в 'uglify()' исправляет некоторое нечетное поведение точки останова в Chrome. – Arktronic

Смежные вопросы