Gulp: 에러 핸들링

발생일: 2015.05.17

키워드: Gulp, 걸프, 에러 핸들링, error handling

문제:

걸프 빌드 시 에러가 나면 프로세스가 모두 종료되어 버린다.

좀 더 효과적으로 에러 처리를 할 수 있는 방법 없을까?

해결책:

걸프는 스트림을 파이프로 연결해 빌드를 수행하기 때문에,

에러가 발생하면 파이프를 타고 전달돼 전체 프로세스가 종료되어 버린다.

만약, watch 를 걸어둔 상태였다면, 문법 에러 정도로 프로세스가 종료되어버려 아주 불편할 수 있다.

아래처럼 간단한 에러 핸들러를 추가하는 방법으로,

에러가 발생했을 때 원하는 방식으로 처리하고, 다른 태스크는 정상적으로 진행되도록 할 수 있다.

function handleError(err) {

  console.log(err);

  this.emit('end');

}

에러 처리를 원하는 스트림에, `error` 이벤트에 대한 핸들러로 위 함수를 추가해주면 된다.

위 코드는 에러를 콘솔로 출력한 후에, `end` 이벤트를 발생해서 현재 스트림을 종료하도록 한다.

에러를 처리했기 떄문에, 다른 프로세스는 정상적으로 진행된다.

예를 들어, `less`에서의 에러를 처리하고 싶다면 아래처럼 추가하면 된다.

gulp.src('less/*.less')

  .pipe(less()).on('error', handleError)

  .pipe(gulp.dest('dist/css'));

`browserify`의 에러를 처리하고 싶다면 역시 아래처럼 추가하면 된다.

browserify('./js/main.js')

  .bundle().on('error', handleError)

  .pipe(source('bundle.js'))

  .pipe(gulp.dest('dist/js'));

에러를 콘솔로 출력하는 것 외에도, 원하는 방식으로 처리하면 된다.

예를 들면, `nofity` 모듈을 사용해서 OS 노티를 주는 것처럼 말이다.

동일한 방식이지만, 파이프를 사용해 에러 처리할 수 있도록 해주는 모듈도 있다.

gulp-plumber 모듈인데, `error`이벤트를 추가하는 부분을 스트림으로 추상화하고 있어서 아래처럼 간결히 작성할 수 있다.

var plumber = require('gulp-plumber');

gulp.src('less/*.less')

  .pipe(plumber())

  .pipe(less())

  .pipe(gulp.dest('dist/css'));

`plumber` 모듈도 핸들러를 옵션으로 전달할 수 있어서, 상세한 에러 처리가 가능하다.

용도에 맞게 적당한 방법으로 골라 사용하면 되겠다.