Mac版 Node.js環境構築方法まとめ

概要

ReactやElectronでの開発を行うにあたって、Node.js開発環境は必須になります。
今回は、MacでNode.js環境を構築する方法についてまとめます。

所要時間: 約10分

注意

2018年4月26日において最新安定版のNode.jsのバージョン(v8.11.1)での構築方法をまとめます。

Node.js環境が構築されているかを確認

Node.jsの環境構築を行う前に、今利用しているMacにNode.js環境があるか
もしくは、v8.11.1より古いものを利用しているかの確認を行います。

1. ターミナルを起動

Spotlight検索を起動

キーボードの⌘ (コマンドキー)とSpace (スペースキー)を同時押しでこちらの画面が表示されます。

Spotlight検索を起動後にすること

「ターミナル」と入力して下さい。

こちらの画像のような表示結果になるので、Enter (エンターキー)を押して下さい。

2. インストール確認

ターミナルに、下記のとおり、node -vと入力しEnterを押下します。

Enterを押して、下記の画像のような表記になれば、Node.jsがインストールされていない環境になります。

インストールされていれば、下記画像のように表示されますが、v8.11.1でなかった場合、続けて環境構築を行いましょう。

Node.js導入方法

ndenvとは

Node.jsのバージョン管理ツールです。
インストール・アンインストールができます。

導入手順

順番にコマンドをコピーして貼り付けます。
1から5まで一つずつ実施しますが、一つ貼り付けるごとにEnter (エンターキー)を押して下さい。

1. git clone https://github.com/riywo/ndenv ~/.ndenv (ndenvをダウンロードします)
2. echo 'export PATH="$HOME/.ndenv/bin:$PATH"' >> ~/.bash_profile (PATH環境変数にndenvを登録します)
3. echo 'eval "$(ndenv init -)"' >> ~/.bash_profile (ターミナル起動時にndenvを有効にします)
4. exec $SHELL -l (1~3までの実行結果を反映します)
5. git clone https://github.com/riywo/node-build.git $(ndenv root)/plugins/node-build (nodeをインストールするのに必要なものをダウンロードします)

続いて、ターミナルでndenvと入力し、Enter (エンターキー)を押して下さい。

こちらの画像のように、たくさんの英語が羅列されていれば成功です。

引き続き、ndenv install v8.11.1を入力してEnter (エンターキー)を押して下さい。

画像の様な結果が表示されます。

最後に、ndenv global v8.11.1を入力してEnter (エンターキー)を押して下さい。

バージョンの確認

今回の導入方法で２つMacにインストールされるものがあります。

• Node.js
• npmというモジュールの管理ツール

それぞれを確認してみましょう。
順番にコマンドをコピーして貼り付けます。
1から２まで一つずつ実施しますが、一つ貼り付けるごとにEnter (エンターキー)を押して下さい。

1. node -v
2. npm -v

画像のように「Node.js」のバージョンがv8.11.1と「npm」のバージョンが5.6.0になっていれば成功です。

あとがき

MacでのReact、Electron開発にて必須なNode.js開発環境の構築方法についてまとめました。
Node.jsの導入方法はHomebrewなど様々ありますが、今回はNode.jsのバージョンをv8.11.1に固定したくて、まとめ記事を共有してみました。

別途、Yarnの導入方法もまとめたいと思います。
ありがとうございました。