ビルドツールとしてnpmを使う

Gruntgulpなどを使うのではなく、npmをビルドタスクを使うためにちょっとおさらいした。

npmのpath

npmでインストールすると、
モジュールは ./node_modules/にインストールされ、
node_modules/.bin配下に各パッケージのbinへのシンボリックリンクが作成される。

これは実際にnpm binを実行するとパスがわかる。

たとえば、node_modules/jshint/bin/jshint は$(npm bin)/jshintで実行できる。
実際にはnpm経由で実行すると、$(npm bin)はPATHは追加されている。

package.jsonに以下を追加して

でパスが通っていることが確認できる。

つまり、npm run TASKではモジュールのパスに$(npm bin)は必要無い。

pre、postフック

npmコマンドにpre、postというprefixをつけることでそのコマンドの前後にフックできる。
たとえば、npm testにpre postそれぞれのフックを追加すると、

npm test を実行すると、 npm run pretest、 npm test, npm run posttest の順番に実行される。

カスタム引数

[email protected] 以上では実行スクリプトにカスタム引数を渡すことができるようになっている。

「–」で 好きな引数を渡すことができる。
たとえば以下のうように

例があまり良くないけど、開発環境やstaging環境などの実行環境でオプションの有無がある場合などに便利。

npm-config

package.jsonにあるconfigはスクリプトからnpm_package_config_NAMEとして参照できる

とある場合、

とすることで参照できる。

各モジュールの設定はpackage.jsonにまとめておくことができる。
.configのようにconfig系のファイルがプロジェクトルートにたくさん作りたくないので、便利。

また、設定したconfigの値はユーザーの$HOMEにある.npmrcの値によて実行時に上書きされる。

これで

となる。各自の環境に合わせた状態などはここで上書きするなどができる感じ。

マルチタスク

マルチタスクはpre、postフックでタスクを実行するほかに&&演算子でつなげていけば可能。

また、標準出力、標準入力、リダレクトをつかってgulpのようにシームレスに処理できる。

ファイル監視

ファイル監視はwatchnodemonなどを使う。

フロントエンドのビルドツールはGruntgulpwebpackを使う規模でなければnpmだけでもいけそう。

Comments