フロント開発のテンプレートエンジンECTをGulpでビルドする際にエラー詳細を出してマシにする

ect使ってますか? ect便利ですよね。

• node.js テンプレートエンジン ECTが爆速!! らしい件

#gulp-ectのエラー表示がしょぼい件

gulpでビルドするときにはgulp-ectっていうプラグインを使うと思います。ectの変更を監視して自動ビルドしてhtmlを吐き出す、みたいなことをよくやります。

ただgulp-ectでエラーが出ると

[09:58:17] Error gulp-ect: must start with number, buffer, array or string

って感じでエラーがおきたことは教えてくれるけど、
####どこのファイルの何行目で何が起こったのかが全く分かりません。

これは問題ですね苦笑

• Gulp-ect

#対策①

ect使う時はect()を呼び出せばいいんですけど、

  //省略
  .pipe($.ect())
　//省略

ここに

　//省略
  .pipe($.ect({data: function (filename, cb) {
     console.log(filename);
     cb({foo: "bar"});
  }}))
//省略

てな感じで書いてあげると

template/index
[09:58:17] Error gulp-ect: must start with number, buffer, array or string

という感じでエラー対象ファイルが分かります。

ただ、まだ行数までは分かりません。

対策②

モジュール側をいじります。

gulp-ectをnpm installするとnode_modules/gulp-ect/index.jsがあると思います。

37行目くらいの

html.render(fileName, data, function (error, html) {
 file.contents = new Buffer(html);
 file.path = gutil.replaceExtension(file.path, opt.outExt);
});

この箇所にエラー表示を記述します。

html.render(fileName, data, function (error, html) {
 if(error) gutil.log(gutil.colors.red('Error gulp-ect detail: ' + error)); //←追記
 file.contents = new Buffer(html);
 file.path = gutil.replaceExtension(file.path, opt.outExt);
});

これでこんな感じで、

template/index
[09:58:17] Error gulp-ect: Failed to load template /Users/ryousuke/Sites/hackathon/gyo/template/common/_header2.ect in /Users/ryousuke/Sites/hackathon/gyo/template/index.ect on line 15
[09:58:17] Error gulp-ect: must start with number, buffer, array or string

エラー内容だったり、対象箇所だったりが表示されます。

##独り言
github上の最新だと

error && gutil.log(gutil.colors.red('Error gulp-ect: ' + error.message));

って記述があってエラーを詳細に出してるみたいだけど、私の環境だとなぜかnpm installした段階でその記載が消えてました。

一応プルリクだしたけど...採用されるのかな

①はnode_modulesまでいじりたく無い人とか応急処置程度で使えるかも。
基本②をやっておけば問題無さそうです。

もっといいやり方あれば教えて下さい ><