4
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

gulp.watchのタスクのあるプロジェクトをGitで管理するときに気をつけたいこと

Last updated at Posted at 2016-10-09

やっぱりどう考えてもQiitaが日本で一番好き。tattです。

昨今のwebのモダンな開発環境では、タスクランナーにgulp、バージョン管理にGitを導入されて、ワンチャン狙ってる方も多いかと思います。
gulp.watchの甘い誘惑に見事に引っかかってしまったので、甘い言葉にはもうだまされないぞ!

「gulpとGitを併用するプロジェクトで気をつけたいこと -2016 夏の面影-」、tatt開催しまーす!!!

環境

OSX 10.10.5
Git 2.9.3
gulp 3.9.1

gulp.watchの甘い誘惑

タスクランナーでgulpを導入されてる方のほとんどは、このタスクを使ってるケースが多いのではないでしょうか。
sass→cssのコンパイル、JavaScriptのバンドル、BrowserSyncなどをファイル変更をwatchさせて自動で変更差分をブラウザに反映させてたりしますよね。
このファイル変更をwatch、いいですよね!
ですが、watchタスクを止めずに$ git checkout branch_nameで別ブランチにcheckoutするとどうでしょうか。

はい、branch_name配下のファイルがwatchされてしまい、さっきまでのブランチとの差分があった場合、したくもないコンパイルが走りますよね。
$ git checkout file_nameで戻せますが、面倒ですよね。

ブランチの切替時にgulpをstopさせる

単純に、$ git checkout branch_name前にgulpタスクをstopさせれば良い。

ヒューマンエラーは防げない

ターミナルやitermなどでgulpのタスク実行とは別のタブでgitコマンドを実行させてしまった…など、ヒューマンエラーは防止が難しいケースがあるかと思います。

シェルスクリプトの関数を利用する

お使いの.bash_profile.bashrc.zshrcなどに

# gulpをとめてからgit checkoutする
function gcheckout () {
  killall gulp && git checkout $1
}

としておけば、

$ gcheckout branch_name

これで、gulpタスクをstopさせた後にブランチ切り替えができます。

新規ブランチ作成への応用

# gulpをstopしてから(新規ブランチ)にgit checkoutする
function gnewbranch () {
  killall gulp && git checkout -b $1
}

としておけば、

$ gnewbranch branch_name

これで、gulpタスクをstopさせた後に新規ブランチを作成し切り替えます。

まさかり募集

もっと良い方法をご存知であればお願いします。。

THANX & BIG UP‼︎‼︎

4
4
3

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
4
4

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?