ブログ
開発環境構築を楽にしたい
昨今、nodeやらgrunt/gulpと開発環境を作るにもひと手間かかります。
ちょっと更新だけ引き継ぎたい、なんて時に、この「ひと手間」がハードルに。
そこで、開発環境の引き継ぎを楽にする環境をつくりました。
概要
今回使用するのは、こちらの3点。
「nodenv」を使用して、作業者間によるNode.jsのバージョンの違いを防ぎ、
「npx」を使用して、各環境に依存せず、
「.command」を使用して、ダブルクリックで開発環境を整える
ことが、今回の目標です。
「nodenv」
「nodenv」はNode.jsのバージョン管理マネージャーのひとつです。
nodenvは各開発環境毎にNode.jsを適用します。
また、「.node-version」というファイルをつくり、これに指定されたバージョンにNode.jsを自動的に切り替えます。
これによって、作業者によるNode.jsのバージョンの違いを防ぐことができます。
「npx」
「npx」について、詳しくはこちら。
npxを使用することで、グローバルにgulp（gulp-cli）がインストールされていない環境でも、gulpを使用できます。
「.command」
「.command」は、いわゆる「バッチファイル」と言われているもの、Windowsでいうと「.bat」ファイルです。
ダブルクリックで中の記述が実行されます。
.command を使用して、ダブルクリックで開発環境が整うようにすることが、今回の目標です。
1.nodenv、Node.jsのインストール
(1)nodenvインストール
$ git clone git://github.com/nodenv/nodenv.git ~/.nodenv
nodenvをホームディレクトリにクローンします。
$ vi ~/.bash_profile
$ source ~/.bash_profile
nodenvをクローンした後、nodenvにパスを通します。
内容はこちら。
export PATH=”$HOME/.nodenv/bin:$PATH”
eval “$(nodenv init -)”
次に、node-buildというnodenvのプラグインをインストールします。
$ git clone https://github.com/nodenv/node-build.git ~/.nodenv/plugins/node-build
$ nodenv init
インストール後、nodenvを再ロードして反映します。
(2)Node.jsインストール
$ nodenv install --list
インストールできるバージョンを確認します。
$ nodenv install 9.2.0
$ nodenv rehash
指定のバージョンをインストール、反映します。
ここまでではインストールされたのみで、有効になってはいません。
(3)各プロジェクト毎にNode.jsを有効にする
プロジェクトのワークスペースに移動します。
$ node -v
v8.9.1
私のグローバルのnodeのバージョンはv8.9.1です。
$ nodenv local 9.2.0
ここに、nodenvで先ほどインストールした v9.2.0 を適用します。
$ ls -la
total 8
drwxr-xr-x 3 username group 102 12 19 12:30 .
drwxr-xr-x 19 username group 646 12 19 12:27 ..
-rw-r--r-- 1 username group 6 12 19 12:30 .node-version
$ cat .node-version
9.2.0
$ node -v
v9.2.0
.node-version が作成されます。
.node-version にはバージョンが書かれているだけですが、nodenvは .node-version がある場合そのバージョンのNode.jsを使用するように切り替えます。
2.「.command」の作成
作成した「.command」は3種。
(1) nodenv install
(2) npm install
(3) gulp watch
.commandファイルのベースはこちら。
#!/bin/sh
cd `dirname $0`
（ここに実行したいコマンドを書く）
killall Terminal
こちらの記事（これは便利！Macで複数のファイルやアプリを１クリックで起動するバッチ（command）ファイルを作る方法）を参考にさせていただきました。
(1) nodenv install
01-nodenv.command
#!/bin/sh
cd `dirname $0`
nodenv install 9.2.0
nodenv rehash
killall Terminal
$ node -v
nodenv: version `9.2.0' is not installed (set by /Users/username/workspace/sample/.node-version)
.node-versionに指定されているNode.jsがインストールされていない場合は、エラーになります。
この場合に、01-nodenv.commandでインストールします。
(2) npm install
02-install.command
#!/bin/sh
cd `dirname $0`
npm install
killall Terminal
(3) gulp watch
03-gulp.command
#!/bin/sh
cd `dirname $0`
npx gulp watch
ここで「npx」を使用します。
gulp watch の代わりに npx gulp watch を使用することで、
作業者の環境にgulp-cliがインストールされているいないに関わらず、gulpを使用できます。
watchを止めるときは、いつも通り[control]+[c]で停止します。
実行権限の付与
.commandファイルの権限を「rwxr–r–」にします。
$ chmod 744 *.command
以上で、.commandファイルをダブルクリックで中身が実行されるようになりました。