アカベコマイリ

HEAR NOTHING SEE NOTHING SAY NOTHING

npm-run-all v1.2.8 を試す

September 01, 2015開発JavaScript, Node, npm-run-all

npm-run-all と concurrently を試す で npm-run-all の watchify 終了に問題があることを書いたら作者である mysticatea さんから調査してみる旨、コメントをいただいた。

その後どうなったかな?と npm-run-all のリポジトリをチェックしてみたら Fix: ignores killed tasks. というコミットが。どうやら終了コードが null の場合でも 0 と同様に処理するよう変更したらしい。おそらくこの対応により watchify のプロセスが完全終了しない問題も直るはず。

というわけで改めて npm-run-all v1.2.8 による watchify を含めたファイル監視と終了を試してみた。npm-scipts は以下のように定義。

"scripts": {
  "start": "npm run watch",
  "watch:css": "watch \"npm run build:css\" ./src/stylus/",
  "watch:js": "watchify -v -t babelify ./src/js/App.js -o \"exorcist ./src/bundle.js.map > ./src/bundle.js\" -d",
  "watch:server": "browser-sync start --server src",
  "watch": "npm-run-all -p watch:css watch:js watch:server"
}

実行してから JavaScript の編集と保存を実行して watchify による監視とコンパイルが動作することを確認。その後に Ctrl + C で中断してみる。

$ npm start

> front-end-starter@1.0.2 start /examples-web-app/front-end-starter
> npm run watch

> front-end-starter@1.0.2 watch /examples-web-app/front-end-starter
> npm-run-all -p watch:css watch:js watch:server

> front-end-starter@1.0.2 watch:css /examples-web-app/front-end-starter
> watch "npm run build:css" ./src/stylus/

> front-end-starter@1.0.2 watch:js /examples-web-app/front-end-starter
> watchify -v -t babelify ./src/js/App.js -o "exorcist ./src/bundle.js.map > ./src/bundle.js" -d

> front-end-starter@1.0.2 watch:server /examples-web-app/front-end-starter
> browser-sync start --server src

> Watching ./src/stylus/

> front-end-starter@1.0.2 build:css /examples-web-app/front-end-starter
> stylus -c ./src/stylus/App.styl -o ./src/bundle.css -m

  compiled ./src/bundle.css
  generated ./src/bundle.css.map
[BS] Access URLs:
 ------------------------------------
       Local: http://localhost:3000
    External: http://192.168.0.5:3000
 ------------------------------------
          UI: http://localhost:3001
 UI External: http://192.168.0.5:3001
 ------------------------------------
[BS] Serving files from: src
10290 bytes written to exorcist ./src/bundle.js.map > ./src/bundle.js (1.15 seconds)
10380 bytes written to exorcist ./src/bundle.js.map > ./src/bundle.js (0.11 seconds)
10290 bytes written to exorcist ./src/bundle.js.map > ./src/bundle.js (0.09 seconds)
^C

npm-run-all v1.2.6 で発生していたエラーは起きず正常終了されている。つまり mysticatea さんの修正は有効だった。v1.2.8 ならば元記事のように watch だけ concurrently にする必要もない。npm-scripts の直列・並列実行はすべて npm-run-all へ統一できそうだ。というわけでそれを反映したサンプルを以下に公開。

元記事とそれを書く契機となった gulp なしの Web フロントエンド開発 にもこのの修正に関して追記する予定。

mysticatea さん、調査と修正ありがとうございました。