本文出自 我的 github
在上一篇文章中介紹了 Windows 下 Ionic 開發環境的搭建，這篇文章主要介紹 macOS 下 Ionic 環境搭建
開始安裝 Ionic
Ionic 的開發環境需要安裝的組件：
- Node.js
- Cordova & Ionic CLI
- Java SDK
- Android SDK
安裝 Node.js
前往 Node.js 官網下載 Node.js 安裝包直接安裝，我下載的是 v4.4.5 LTS，通過官網下載到的是 pkg 包，鼠標雙擊安裝即可
由于之前我用 Homebrew 遇到過這樣那樣的問題，所以果斷改用官網提供的 pkg 包來安裝了，喜歡折騰的朋友可以使用 Homebrew 或者其它方式去安裝
安裝完成后打開終端輸入 “node -v” 命令測試下是否安裝成功
更新 npm（可選）
在終端輸入 “npm i npm -g” 命令更新npm
安裝 Cordova & Ionic CLI
在終端輸入 “npm i cordova ionic -g” 命令，等待安裝完成；安裝完成后，輸入 “cordova -v” 命令和 “ionic -v” 命令，能正常顯示版本號說明安裝成功
安裝 Java SDK (jdk)
前往 Oracle 官網下載最新的 jdk 安裝，我下載的是 jdk-8u91-macosx-x86.dmg
為 jdk 設置系統環境變量
安裝好 jdk 之后，在終端輸入 “vim ~/.bash_profile” 打開 vim 來編輯 .bash_profile 文件，增加一行 export JAVA_HOME=$(/usr/libexec/java_home)，建議和其它 export 項放在一起便于維護
不熟悉 vim 操作的朋友可以參考這個 vim 教程
安裝 Android SDK
前往 Android 官網（需要翻墻） 下載最新的 Android SDK 安裝，目前最新的版本是 r24.4.1；你也可以復制 這個鏈接，然后使用迅雷下載，然后解壓到 “/Developer” 目錄下
為 Android SDK 設置系統環境變量
在終端輸入 “vim ~/.bash_profile” 打開 vim 來編輯 .bash_profile 文件，增加一行 export ANDROID_HOME=/Developer/android-sdk-macosx，和一行 export PATH=${PATH}:${ANDROID_HOME}/tools:${ANDROID_HOME}/platform-tools/
設置完成后打開終端，輸入“android”命令，能打開 Android SDK Manager 窗口說明安裝成功
使用 Android SDK Manager 安裝所需組件
Android SDK 各版本的 SDK Platform 和 Tools 并沒有內置在 Android SDK 中，所有我們要通過 Android SDK Manager 來安裝。打開 Android SDK Manager 后，選擇要安裝的組件
由于我一般是用真實 Android 設備來開發，所以我只選擇了 Android SDK Tools、Android SDK Platform-tools、Android SDK Build-tools、Android Support Repository，以及Android API 19-24 的 SDK Platform
如果要使用 Android 內置的虛擬機來運行 App 的話，還需要下載對應版本的 System Image，這里我們不再贅述
點擊 Install 按鈕，等待安裝完成
到此，Ionic 開發環境已安裝完畢！
測試環境
安裝完開發環境后，我們通過一個 Demo 來測試一下環境
打開終端，創建一個項目
項目創建完成后，Ionic 會自動添加一個 ios platform，所以無需重復添加
運行一下試試
運行成功！
可能存在的問題
- 使用 npm 全局安裝時提示權限錯誤
解決這個問題的辦法可以參考 這篇文章
結語
本文寫給 Ionic 入門開發者，有開發經驗者可以略過
如在安裝過程中遇到問題，請在文章下方留言，我在收到留言后會及時答復您
