gulp.watchがうまく動作してくれない

Question

gulpでTypeScriptファイルの変更をgulp.watch()で監視して、ファイルに変更があったら"build"というタスクを実行させたいのですが、いまいち上手く動作してくれません。

最初にTypeScriptのファイルに変更があった時は正常に"build"タスクが実行されるのですが、それ以降はTypeScriptのファイルに変更があっても、"build"タスクが実行してくれません。

gulpはまだ不慣れで直接処理、並列処理の書き方やwatchの使い方の理解があやふやなのですが、
このコードのどこがおかしくて、どういう書き方が適切なのでしょうか？

ちなみに、"build"タスクでは、gulpのrun-sequenceモジュールを使って、
直接処理と並列処理を行っています（行っているつもりです）

ご教授頂ければ幸いです。よろしくお願い致します。

var gulp = require("gulp");
var typescript = require("gulp-typescript");
var plumber = require('gulp-plumber');
var runSequence = require("run-sequence");
var browserify = require("browserify");
var source = require("vinyl-source-stream");

gulp.task("compileTypeScript", function() {

    return gulp.src("./TypeScript/*.ts")
        .pipe(plumber())
        .pipe(typescript())
        .on("error", function(error) {
            console.log(error.message)
        })
        .pipe(gulp.dest("./JavaScript"));


});


gulp.task("browserify", function() {

    return browserify({entries: ["./JavaScript/Main.js"]})
        .bundle()
        .pipe(source("Main.bundle.js")) //出力先ファイル名
        .pipe(gulp.dest("./build")); //出力先ディレクトリ

});


gulp.task("log", function() {
    return console.log("successfully done!!");
});



gulp.task("watch", function() {
    gulp.watch("./Typescript/*.ts", ["build"]);

});


gulp.task("build", function(callback) {

    runSequence(
      ["compileTypeScript"], //配列に入っているタスクは並列処理
      "browserify", //直接処理
      "log" //直接処理
    );

});


gulp.task("default", ["watch"]);

Answer 1

情報が足りなかったので実際にプロジェクト作って動かして確認してみました。
このようにログさえあればおかしい所が検討出来るようになるので是非ログも添える習慣付けをお願いします。

$ gulp
(node:77657) fs: re-evaluating native module sources is not supported. If you are using the graceful-fs module, please update it to a more recent version.
[10:35:46] Using gulpfile ~/private/teratail/node-q/gulpfile.js
[10:35:46] Starting 'watch'...
[10:35:46] Finished 'watch' after 13 ms
[10:35:46] Starting 'default'...
[10:35:46] Finished 'default' after 35 μs
[10:35:58] Starting 'build'...
[10:35:58] Starting 'compileTypeScript'...
[10:35:59] Finished 'compileTypeScript' after 1.16 s
[10:35:59] Starting 'browserify'...
[10:35:59] Finished 'browserify' after 16 ms
[10:35:59] Starting 'log'...
successfully done!!
[10:35:59] Finished 'log' after 75 μs

上記おかしい所が2点

• fsがなんかWarning吐いてる → 最近のgulp.watchは最新のNode.jsからすると古いライブラリを使用しているようです。
• buildタスクが終わってない

buildタスク内ですが、callbackを関数内部で宣言しているにも関わらず呼び出してないですね。
このように修正することで動くようになりました。

gulp.task("build", function(callback) {

    runSequence(
      ["compileTypeScript"], //配列に入っているタスクは並列処理
      "browserify", //直接処理
      "log", //直接処理
      callback
    );

});

$ gulp
(node:77687) fs: re-evaluating native module sources is not supported. If you are using the graceful-fs module, please update it to a more recent version.
[10:37:17] Using gulpfile ~/private/teratail/node-q/gulpfile.js
[10:37:17] Starting 'watch'...
[10:37:17] Finished 'watch' after 13 ms
[10:37:17] Starting 'default'...
[10:37:17] Finished 'default' after 32 μs
[10:37:30] Starting 'build'...
[10:37:30] Starting 'compileTypeScript'...
[10:37:31] Finished 'compileTypeScript' after 1.08 s
[10:37:31] Starting 'browserify'...
[10:37:31] Finished 'browserify' after 17 ms
[10:37:31] Starting 'log'...
successfully done!!
[10:37:31] Finished 'log' after 90 μs
[10:37:31] Finished 'build' after 1.1 s
[10:37:39] Starting 'build'...
[10:37:39] Starting 'compileTypeScript'...
[10:37:40] Finished 'compileTypeScript' after 530 ms
[10:37:40] Starting 'browserify'...
[10:37:40] Finished 'browserify' after 5.47 ms
[10:37:40] Starting 'log'...
successfully done!!
[10:37:40] Finished 'log' after 24 μs
[10:37:40] Finished 'build' after 537 ms

Comments

[退会済みユーザー]

ご回答頂きましてありがとうございます！自己解決報告の投稿と時間差で投稿頂いていたみたいで大変恐縮です。

ご指摘の通り、callbackのところが問題箇所でした！（自己解決報告の回答には修正箇所無かったと書いてますが、言われてみればそこは修正してました）

後ほど、PCからアクセスする際にベストアンサーを切り替え致します。

プロジェクトまで作成して試して頂いて有難うございました！

Answer 2

自己解決致しました。

問題解決のため、コードを修正したりはしましたが、結果的には修正する必要ななく、掲載していたコードで問題なく動作致しました。

エディターの不具合だったのか何なのか分からないのですが、時間が解決致しました。---

自己解決致しました。

■追記
自己解決報告の回答を投稿後、時間差でmiyabi-sunさんからご回答を頂いていたので、
miyabi-sunの回答をベストアンサーに変更致しました。

また、結果的にコードを修正することなく不具合部分は解消されたと上記に書きましたが、
miyabi-sunの回答にある通り、callback部分を修正時に加えていたことを思い出しました。