Browserify sadece tüysüz Gulp

Question

Bu Gulp akışı elde etmek çalışıyorum içinde geçerse:

Oldukça düz ileri süreç gibi görünüyor, ama anlarım kadarıyla, bu mümkün değildir Gulp akışı olarak uygulamak.

gulp.task('js', function() { 
    return browserify('foo/main.js') 
     .bundle() 
     .pipe(source('bundle.js')) 
     .pipe(streamify(jshint())) 
     .pipe(jshint.reporter('default')) 
     // source map, minify, … 
}); 

sorun JSHint yalnızca değiştirilen dosya üzerinde, ilk çalışması gerektiğini ve tiftik başarısız olursa işlem iptal edilmelidir:

Şu anda yapıyorum. Kurulumumda, Browserify her zaman çalışır ve sadece o zaman JSHint tüm paket üzerinde çalışır. Performans cezasıyla başa çıkabilirim, ancak JSHint'in satır numaraları, oluşturulan bir paketle değil, bir JS kaynağı olan dosyama karşılık geliyor.

Answer 1

Bu harika bir fikir. Bunu, varsayılan muhabiri kullanan tint dosyalarını izleyecek olan watchify'ı kullanarak pipeline uyguladım ve dosya değiştiğinde tiftik testini geçemediyse başarısız muhabiri kullanıyorum. Bu konuda tavsiye edilmesine rağmen, kişisel olarak bunu yapmaktan kaçınmak istiyorum çünkü sadece sizin muhabirinizin tüysüz çekler yayması için değil, aynı zamanda gelişim gözlemcisinin arka planda hala devam etmesini sağlayın. Aksi takdirde, genellikle beni rahatsız etme eğiliminde olan görevi yeniden başlatmanız gerekir. Neyse, işte kod:

'use strict'; 

var assign  = require('object-assign'), 
    gulp   = require('gulp'), 
    gutil  = require('gulp-util'), 
    merge  = require('merge-stream'), 
    jshint  = require('gulp-jshint'), 
    source  = require('vinyl-source-stream'), 
    watchify  = require('watchify'), 
    browserify = require('browserify'); 

var resources = { 
    mainJS : 'main.js', 
    bundleJS : 'bundle.js', 
    root  : 'www' 
}; 

function res(r) { 
    return './' + resources[r]; 
} 

gulp.task('watch', function() { 
    var bundler = watchify(browserify(res('mainJS'), assign(watchify.args, { 
     fullPaths: false 
    }))); 

    var scripts = function(changedFiles) { 
     var compileStream = bundler 
      .bundle() 
      .on('error', gutil.log.bind(gutil, gutil.colors.red('Browserify Error\n'))) 
      .pipe(source(res('bundleJS'))) 
      .pipe(gulp.dest(res('root'))); 

     if (changedFiles) { 
      var lintStream = gulp.src(changedFiles) 
       .pipe(jshint()) 
       .pipe(jshint.reporter('default')) 
       .pipe(jshint.reporter('fail')); 

      return merge(lintStream, compileStream); 
     } 

     return compileStream; 
    }; 

    bundler.on('update', scripts); 

    return scripts(); 
}); 

Not Bu hızlı browserify için resmi reçete kapalı ağır dayandığı watchify (https://github.com/gulpjs/gulp/blob/master/docs/recipes/fast-browserify-builds-with-watchify.md) ile oluşturur ve bir 'hepsi-bir-arada' türü bir iştir; ben genel olarak :-)