Ловушка Browserify parse error (автономная опция)
Я использую gulp + браузер для сборки и упаковки своей библиотеки javascript. Теперь есть одна вещь, которая меня беспокоит: я запускаю простой сервер с функцией загрузки для разработки через gulp. Это прекрасно работает, но всякий раз, когда мой javascript содержит синтаксическую ошибку, браузеры вызывают ошибку, приводящую к остановке сервера.
Используемый мной код браузера (обратите внимание, что я добавил обработчик ошибок):
browserify("./src/main.js")
.bundle({standalone: "SomeName", debug: false}).on('error', notify.onError({
message: "Error: <%= error.message %>",
title: "Failed running browserify"
})
);
Теперь идет интересная часть:
Когда я удаляю автономную настройку (а мой js синтаксически неверен), срабатывает обработчик ошибок. Однако, когда я использую эту автономную настройку, обработчик ошибок не срабатывает (в результате сервер останавливается при остановке gulp)
Кто-нибудь знает, как справиться с этой проблемой? Я всегда мог вручную проверить мои файлы js в gulp, но хотел бы избежать этого обходного пути
Ответы
Ответ 1
Событие on('error')
все еще запущено. Тем не менее, браузерный поток немного отличается от потока Gulp. В функции обработчика ошибок браузера необходимо явно вызвать this.emit("end")
Пример Gulp task
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/
Ответ 2
Как никто не отправил ответ (не стесняйтесь исправить меня, если у вас есть лучшее решение!), вот обходной путь, который я добавил, чтобы заставить мой прецедент работать. Я понял, что запланированная версия Gulp (v4) будет лучше поддерживать обработку ошибок, возможно, решить эту проблему. Однако на данный момент я использую js validator
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'))
});
});
Ответ 3
Ну, потому что я не мог найти решения, которые будут продолжать смотреть 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(укажите его как хотите) в текущей папке, задайте пути и запустите этот файл в node с CLI
. Вам даже не нужно устанавливать браузеру локально, если у вас есть глобально. Надеюсь, это поможет.
Ответ 4
После поиска решения, которое не разбивается на gulp и продолжает просмотр/переадресацию, даже если браузеру сработает преобразование, я, наконец, нашел его. Я написал небольшое сообщение в блоге об этом:
http://latviancoder.com/story/error-handling-browserify-gulp
Ответ 5
Вот код, который предотвращает сбой задачи 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'])
});