2019年4月14日

Macのフロントエンド環境準備

とりあえずよく聞く、Homebrew(ホームブリュー)Node.js(ノードジェイエス)をインストールする。作業は主に「ターミナル」でおこなう。

Homebrewのインストール

Homebrewは、Macへのソフトウェア導入をシンプルにするシステム。公式サイトにあるスクリプトをコピーして「ターミナル」から実行(returnキー)すると、


Press RETURN to continue or any other key to abort

と表示されるので、returnキーを押すと、


Password:

と表示されるので、自分のPCにログインするときのパスワードを入力すると、インストールが開始される。

途中、Command Line Toolsのインストールで止まったよにうに見えるが、


Downloading Command Line Tools (macOS Mojave version 10.14) for Xcode
Downloaded Command Line Tools (macOS Mojave version 10.14) for Xcode
Installing Command Line Tools (macOS Mojave version 10.14) for Xcode

時間がかかっているだけなのでそのまま放置でOK。インストールが完了したら、バージョンを確認する。


brew --version

バージョンが表示されればOK。

Node.jsのインストール

Node.jsはサーバ側で使えるJavaScript、まずはそれぐらい適当な認識で良いと思う。 先ほどインストールしたHomebrewを使ってインストールする。

…が、Node.jsは必要に応じてバージョンを変更する機会があるため、まずNode.jsのバージョンを管理するツールを先にインストールする。

バージョン管理ツールにはいくつか種類があるが、ここでは「nvm」をインストールしてみる。


brew install nvm

インストールが完了してもまだnvmは使えず、続いて以下の2点を追加で実行する。


mkdir ~/.nvm

でホームディレクトリに「.nvm」フォルダを作成するのと、インストール完了で表示されるメッセージのうち、


  export NVM_DIR="$HOME/.nvm"
  [ -s "/usr/local/opt/nvm/nvm.sh" ] && . "/usr/local/opt/nvm/nvm.sh"  # This loads nvm
  [ -s "/usr/local/opt/nvm/etc/bash_completion" ] && . "/usr/local/opt/nvm/etc/bash_completion"  # This loads nvm bash_completion

というテキスト(環境やバージョンでメッセージは内容は変わるかも)をコピーしておき、


vim ~/.bash_profile

で、.bash_profileというファイルをVim(ヴィム)で開く(なければ自動で作成される)。Vimはターミナル上で使える特殊なテキストエディタで、「i」キーで入力モードにしてから先ほどコピーしておいたテキストを貼り付ける。

その後、「esc」キーで入力モードを終了させ、


:wq

で保存してVimを終了する(余談までに、保存しないで終了する場合は「:q!」)。

一度ターミナルを再起動すればnvmが使えるようになるので、 バージョンを確認しておく。


nvm --version

バージョンが表示されればOK。

ここから、本題となるNode.jsのバージョンを管理するツールを先にインストールする。


nvm ls-remote

で、インストール可能なバージョンを調べることができるので、試しに表示された一覧から「LTS(長期サポート)」と表記されているバージョンのうち、最新から2種類(ここではv10.15.3とv8.15.1)をインストールする。


nvm install v8.15.1
nvm install v10.15.3

インストールしたバージョンは、


nvm ls

で確認でき、矢印がついているバージョンが今使用しているバージョンで、変更する場合は、


nvm use 変更したいバージョン

と指定する。ただし、ターミナルを再起動するとバージョンがリセットされるので、毎回「use」で指定するのが面倒な時は、


nvm alias default 変更したいバージョン

で、デフォルトのバージョンを指定する。