Windows で node-gyp を使った npm を動かすための環境構築
Electron の Starter プロジェクトで #7 Windows 版パッケージにバージョン情報リソースを含める を動作させるのに Node 以外で必要なものがあるため、それらの環境構築についてまとめる。
npm のなかに node-gyp というプラットフォームのネイティブ機能を利用するための npm を利用しているものがある場合、Windows 環境で npm install すると Python や CL.exe が見つからないというエラーが起きる。
これらを防ぐためには Node の他に Python と Visual C++ をインストールする。
Python
Python のインストーラーは Download ページから入手。バージョンは 2.x 系と 3.x 系に分かれているのだが node-gyp が 3.x 対応していなさそうなのと Ansible など他のツールも同様なので、今回は 2.x 系の最新である 2.7.10 を選択。
OS にあわせて Windows x86-64 MSI installer または Windows x86 MSI installer を選ぶ。私は VMware FUSION 上で Windows 8.1 64bit を利用しているので x86-64 にした。
インストールで詰まるところは特にない。ウィザードにしたがって進めてゆくだけで終わる。インストール先のフォルダは環境変数の設定で必要になるので覚えておくこと。変更していないなら C:¥Python27 になっているはず。
インストーラーは Python のパスを環境変数に設定しないようで、インストール後にコマンドプロンプトから python コマンドを実行してもエラーになる。そのため自前で追加する必要あり。Windows 8.1 なら以下のようにする。
- 「コントロール パネル」を開く
- 一覧から「システムとセキュリティ」を選択
- 一覧から「システム」を選択
- 左のメニューから「システムの詳細設定」を選択して「システムのプロパティ」ダイアログを開く
- 「詳細設定」タブ内の「環境変数...」ボタンを押して「環境変数」ダイアログを開く
- 「XXXX のユーザー環境変数」と「システム環境変数」欄があるので、後者の「Path」を選択して「編集」ボタンを押し「システム変数の編集」ダイアログを開く
- 環境変数の末尾に
C:¥Python27を追加、既に登録されている変数があるなら;で区切り既存の変数;C:¥Python27のようにすること - 「システム変数の編集」ダイアログの「OK」ボタンを押してダイアログを閉じる
- 「環境変数」ダイアログの「OK」ボタンを押してダイアログを閉じる
- コマンド プロンプトを起動
- プロンプトに
python --versionを入力して Enter キーを押す - Python のバージョン情報が表示されれば成功
以下は参考画像。
最後の手順で Pyhton のバージョン情報が表示されない場合は、環境変数が間違っていないことを確認する。この作業はいわゆるパスを通すというもので、環境によっては即時反映されない可能性もある。その場合、コマンド プロンプトや OS を再起動してから実行する必要がある。
Visual C++
Visual C++ は Visual Studio の一部なのでこちらのインストーラーを入手。2015/10 時点のダウンロードページには 3 種類のエディションが公開されているはず。これらの中から Community か Enterprise を取得。インストール途中で構成物を選択できる。その中から Visual C++ をチェック。以下は参考画像。
これを忘れてもインストーラを再起動することで不足している機能を追加できる。デフォルトでは Visual C++ が選択されないため割りと忘れそう。というかこの参考画像は私がチェックを忘れてインストーラーを再起動したときのものである。
npm install で確認
正しく環境構築できたか確認してみよう。以下のプロジェクトを取得してコマンド プロンプトから electron-starter フォルダまで移動する。
npm install を実行。コマンド プロンプトにインストール結果が出力されてゆくのでこの中に Python や CL.exe が見つかりませんといったエラーが起きていないことを確認。
更に npm run release:win を実行。Windows 用 Electron アプリがビルドされる。その中にある Starter.exe のアイコンとファイルのプロパティを確認。アイコンが Electron 標準のうすい緑っぽいものではなく electron-starter/res/app.ico と同じものになっていてファイルのプロパティの詳細タブで製品名が Starter なら成功。
今回の環境構築は Node だけで閉じた npm を利用するなら不要。しかし開発ツール系の npm だと node-gyp も結構あるようだ。そのため Windows 環境なら転ばぬ先の杖という意味で Python と Visual C++ も入れておいたほうがよさそう。