web-dev-qa-db-ja.com

Browserify解析エラーのキャッチ（スタンドアロンオプション）

私はgulp + browserifyを使用して、javascriptライブラリをビルドおよびパッケージ化しています。気になることが1つあります。gulpを介した開発のために、livereloadを使用した単純なサーバーを実行しています。これは正常に動作しますが、JavaScriptに構文エラーが含まれている場合は常に、browserifyがエラーをスローしてサーバーを停止させます。

私が使用するbrowserifyコード（エラーハンドラーを追加したことに注意してください）：

browserify("./src/main.js")
   .bundle({standalone: "SomeName", debug: false}).on('error', notify.onError({
            message: "Error: <%= error.message %>",
            title: "Failed running browserify"
    })
);

興味深い部分が来ました：スタンドアロン設定を削除すると（そして私のjsが構文的に正しくない場合）、エラーハンドラーが起動します。ただし、このスタンドアロン設定を使用すると、エラーハンドラーが起動しません（サーバーがgulp停止によって起動されます）。

誰かがこの問題に対処する方法を知っていますか？私はいつでもgulpでjsファイルを手動で検証できますが、この回避策は避けたいです

node.jsgulpbrowserify
21
Laurens Rietveld

on('error')イベントは引き続き発生します。ただし、browserifyストリームは他のGulpストリームとは少し異なります。 browserifyのエラーハンドラー関数では、this.emit("end")を明示的に呼び出す必要があります

Gulpタスクの例

_var browserify = require('browserify');
var gulp = require('gulp');
var source = require("vinyl-source-stream");
var reactify = require('reactify');

gulp.task('browserify', function(){
  // create new bundle
  var b = browserify();
  // add transform if you want
  b.transform(reactify);
  // add file to browserify
  b.add("./src/main.js");
  // start bundling
  return b.bundle()
    .on('error', function(err){
      // print the error (can replace with gulp-util)
      console.log(err.message);
      // end this stream
      this.emit('end');
    })
    .pipe(source('main.js'))
    // pipe other plugin here if you want
    .pipe(gulp.dest('./dist'));
});
_

エラー関数ハンドラはgulpのクラッシュを防ぎ、this.emit("end")は現在のストリームを停止し、次のパイプに実行させません。イベントハンドラーは、変換プラグインでエラーをキャッチすることもできます。

詳細については、こちらをご覧ください http://truongtx.me/2014/07/15/handle-errors-while-using-gulp-watch/

59
tmtxt

誰も答えを投稿しなかったので（より良い解決策があれば、遠慮なく修正してください！）、ユースケースを機能させるために追加した回避策を次に示します。計画されているGulpバージョン（v4）がエラー処理をより適切にサポートし、この問題を解決する可能性があることを理解しました。ただし、ここでは jsバリデーター を使用します

var jsValidate = require('gulp-jsvalidate');
var notify = require("gulp-notify");
gulp.task('browserify', function() {
    gulp.src("./src/*.js").pipe(jsValidate()).on('error', notify.onError({
            message: "Error: <%= error.message %>",
            title: "Failed running browserify"
        })).on('finish', function(){
            browserify("./src/main.js")
            .bundle({standalone: "SomeName", debug: true}).on('error', notify.onError({
                message: "Error: <%= error.message %>",
                title: "Failed running browserify"
              }))
        .pipe(source('output.js'))
    });
});
2
Laurens Rietveld

まあ、browserifyでgulpファイルを監視し続ける解決策が見つからなかったので、これを解決します

var exec = require('child_process').exec;
var fs = require('fs');
//watching changes from watchFile command
fs.watchFile('prim.js',[ { interval: 100 }] , function (curr, prev) {
//running cli command on change
  exec('powershell.exe -Command "browserify prim.js -o main.js"', function(err, stdout, stderr) {
    console.log(stdout);
  })
  .stdin.end();
});

現在のフォルダーにhelper.js（必要に応じて名前を付け）ファイルを追加し、パスを設定して、CLIからノードでそのファイルを実行するだけです。グローバルにインストールしている場合は、browserifyをローカルにインストールする必要はありません。お役に立てれば。

1
IGRACH

バンドルエラーの場合にgulpタスクがクラッシュするのを防ぐコードは次のとおりです。 @tmtxtが投稿したコードを少し変更したバージョンです。彼のバージョンで私が抱えていた問題は、最初の障害が発生した後、「gulp.watch」が更新を停止することでした。

var browserify = require('browserify');
var gulp = require('gulp');
var source = require("vinyl-source-stream");

gulp.task('browserify', function () {
    browserify(paths.src.client.app)
    .bundle()
    .on('error', function(err){
        console.log(err.message);
    })
    .pipe(source(paths.dest.client.bundle))
    .pipe(gulp.dest(paths.dest.client.scripts));
});

gulp.task('watch-browserify', function () {
    gulp.watch([paths.src.client.scripts], ['browserify'])
});
1
Janusz Kacalak

Gulpをクラッシュさせず、browserify変換がクラッシュしても監視/配信を続行するソリューションを探したところ、ようやく見つかりました。私はそれについて小さなブログ投稿を書きました：

http://latviancoder.com/story/error-handling-browserify-gulp

1
Sergejs Rižovs