(define -ayalog '())

括弧に魅せられて道を外した名前のないプログラマ

Browserify に対して誤解をしていた…

これ、良く読んでなかった僕が悪いんだけど、 Node.js*1 のようにブラウザでも require を使えるようにしようっていうライブラリで、だからそういうとき以外は必要ないんですね……。
Node.js の中にいる間*2は基本的に使う必要がないし、ましてライブラリを書くんだったら特に必要ないですね……。なんか当たり前のことをたまに見落として突っ走ることあるのつらい。

そういえば、この前 gulp と watchify の相性悪いって話を書いたけど、やっぱりダメで仕方ないから別の解法にした。

こんな感じ。

function jasmineScript(){
  return gulp.src('./spec/**/*.js').
    pipe($.jasmine());
}

function jshintScript(){
  return gulp.src('./src/**/*.js').
    pipe($.jshint()).
    pipe($.jshint.reporter('jshint-stylish'));
}

function scripts(watch) {
  var config = { entries: [glob.sync('./src/**/*.js')],
                 debug: watch, cache: {},
                 packageCache: {}, fullPaths: true },
      bundler = browserify(config),
      rebundle = function(file) {
        return bundler.bundle().
          pipe(source('bundle.js')).
          pipe(gulp.dest('./dist'));
      };

  bundler = watch ? watchify(bundler) : bundler;

  bundler.on('update', function(){
    rebundle();
    jshintScript();
    jasmineScript();
  });
  return rebundle();
}

gulp.task('browserify', function(){
  return scripts(false);
});

gulp.task('watchify', function(){
  return scripts(true);
});

gulp は所詮 JavaScript なんだと諦める気持ち大事だと思った。
最初は browserify の使い方が悪いのかなって思ったけど、そうじゃないみたいで gulp と browserify の相性が悪いっていう話自体はそこそこあるみたいなので、そうなのかなってことにして gulp の watch を使うのではなくて watchify に全部任せた方がいい感じみたいなのでそうした。
Web でいくらか情報を漁ってみたけど、残念ながらどのサンプルとか公開してあるコード読んでも動かないか、誤解しているかのどっちかだったのでこうした。

ちなみに watchify の task に対して dependency をつけるやり方は明らかに間違いだと思う。 watchify そのものはタスクとして一度しか実行されないので、そこに対して dependency くっつけても同様に一度しか実行されない*3。あくまでも watchify を起動するだけなんだなー。それでその後は update を確認する度に登録された関数を実行するという感じ。

なので、まぁもしやるならこういうやり方がベターそう。分かんない、僕の環境だとこうせざるを得なかったというだけなので、後続の人の役には立たないと思う。まぁ最近そんな感じ。

*1:CommonJS

*2:つまり、テストとか

*3:はず。僕が間違っているなら教えて欲しい。