1. sawa-zen

    No comment

    sawa-zen
Changes in body
Source | HTML | Preview

プロジェクトでGulpを使用したい場合、グローバルにはgulp-cli、プロジェクトローカルにはgulpを入れなければならず、以下の2つのコマンドを打つことになります。

$ npm install gulp-cli -g
$ npm install gulp --save-dev

ここにおじさんは疑問をいだいてしまいました。

グローバルにインストールしてしまっていいのか? :confounded:

そうです。問題はnpm install gulp-cli -gです。先のやり方はGulp公式が推奨している方法であり、「gulp入門」と検索すれば同じ方法を紹介している記事が多くヒットするので一般的な方法であるのは間違いないです。しかし、この方法はタブーを犯しています。

何がタブーなのか? :hushed:

-gを使ってインストールするnpmモジュールは個々のプロジェクトが依存することの無い疎な状態であるべきだと私は考えます。もっと具体的に言うと、ローカルモジュールの実行の為にグローバルモジュールを実行するのは問題であると言えます。これはnpmモジュール全てに言えると思います。

どういった問題が起こるか? :fearful:

gulp-cliをグローバルにインストールしてしまうと、同じプロジェクトでも開発者によってgulp-cliのバージョンが違う場合が考えられます。gulp-cliは複数のバージョンに対応できる作りになっているものの、本当に大きな仕様変更が無いとは言い切れません。そうなれば今まで正常に動作していたプロジェクトも動かくなりかねません。

じゃあどうしたらいいのよ? :cold_sweat:

gulp-cliのインストールをやめましょう。gulp-cliの主な機能はnode_modules配下のgulpコマンドへパスを通すことです。そんなことはわざわざgulp-cliを経由せずとも、もともとnpm-scriptsが同じ事をしてくれてるじゃあありませんか。

gulpfile.js
var gulp = require('gulp');

gulp.task('hoge', function() {
  console.info('ほげほげ!!');
});

例えば、こんなgulpfile.jsがあったとしたら、

package.json
{
  "scripts": {
    "hoge": "gulp hoge"
  }
}

こんな感じでnpm-scriptsを追加すれば、gulpfile.jsに書いたhogeタスクを実行できます。

$ npm run hoge
// => "ほげほげ!!"

これでプロジェクトがグローバルを犯すことのない疎な構造が出来上がりました!やったね:bow:

npm-scriptsに関しての詳しい使い方については「npm-scriptsの詳しい使い方については「Node.jsユーザーなら押さえておきたいnpm-scriptsのタスク実行方法まとめ」で解説しているのでご参考ください。

どうしてもgulp-cliの機能が使いたいという場合はグローバルじゃなくプロジェクトローカルにインストールすべきです。こんな風に。

$ npm install gulp-cli --save-dev

最後に :speech_balloon:

とは言ったものの少数派の意見なのでGulpの公式に屈服せざるおえない状況の方が多いと思います。是非皆さんのプライベートなプロジェクトなんかで試してみてください。