Ionic Mac 環境配置

·??????? 安裝cordova之前要安裝nodejs 會包含npm安裝（npm是個包管理器），到官網下載https://nodejs.org/en/download/ 是個pkg包下載之后雙擊下載包運行然后 step by step，osx下會自動添加環境變量，不用手動配置，默認安裝到、usr/local下，可以更改目錄?

這一步就可以安裝cordova了和ionic （這一步的主要問題是cordova安裝包的鏡像問題）

·???????

如果提示上面的就表示安裝成功了。$cordova –v；ionic –v

創建Ionic項目 ionic start myIonic blank

其中myIonic為我們的項目名稱?
執行過程它會從github下載項目源碼，請等待。。。?
執行完畢后你到開發目錄下查看會發現多了一個名為myIonic的文件夾，這個文件夾就是Ionic項目的所在目錄了。?
目錄下有以下文件：

hooks?????????? //google之后這個目錄應該是在編譯cordova時自定義的腳本命令，方便整合到我們的編譯系統和版本控制系統中

plugins???????? //cordova插件的目錄，插件的安裝下一節詳述

scss??????????? //scss文件，發布時編譯這個目錄下的文件輸出到www的css目錄中

www???????????? //我們的開發目錄，頁面、樣式、腳本和圖片都放在這個目錄下

--css

--img

--js

--lib

--index.html

bower.json????? //bower配置文件

config.xml????? //Ionic的配置文件 ?可以配置app的id，名稱、描述起始頁和一起其他配置

gulpfile.js???? //gulp構建工具的執行文件，在這個文件中創建任務實現編譯scss，css、js優化等

ionic.project?? //Ionic的項目文件可以配置Ionic命令中livereload的監控文件

package.json??? //npm配置文件

啟動測試服務器：ionic serve

部署到手機和cordova插件的使用

一個簡單的Web應用我們已經開發完成了，接下來我們就要做一些部署到移動端之前的準備了。?
Ionic支持兩個平臺ios、android，默認的Ionic項目并沒有添加這兩個平臺，我們需要手動添加，cd到開發目錄下執行命令：

ionic platform add android

ionic platform add ios

一般項目都需要兩個平臺同時部署，所以我們就添加兩個，執行完畢之后執行命令查看你已經添加的平臺列表：

ionic platform list

結果：

Installed platforms: android 4.0.0, ios 3.8.0

Available platforms: amazon-fireos, blackberry10, browser, firefoxos, windows, windows8, wp8

?

接下來的部署我們分開講述：

http://cordova.apache.org/docs/en/5.1.1/guide/platforms/android/index.html

Install the Java Development Kit (JDK)

Install?Java Development Kit (JDK) 7?or later.

When installing on Windows you also need to set?JAVA_HOME?Environment Variable according to JDK installation path (for example, C:\Program Files\Java\jdk1.7.0_75).

Install the Android SDK

Install the?Android Stand-alone SDK Tools?or?Android Studio. Procceed with?Android?Studio?if you plan developing new Cordova for Android plugins or using native tools to run and debug Android platform. Otherwise,Android?Stand-alone SDK?Tools?are enough to build and deploy Android application.

Detailed installation instructions are available as part of installation links above.

For Cordova command-line tools to work, or the CLI that is based upon them, you need to include the SDK'stools?and?platform-tools?directories in your?PATH. On a Mac, you can use a text editor to create or modify the~/.bash_profile?file, adding a line such as the following, depending on where the SDK installs:

??? export PATH=${PATH}:/Development/android-sdk/platform-tools:/Development/android-sdk/tools

This line in?~/.bash_profile?exposes these tools in newly opened terminal windows. If your terminal window is already open in OSX, or to avoid a logout/login on Linux, run this to make them available in the current terminal window:

??? $ source ~/.bash_profile

Android?
Android部署分真機和虛擬機，其實方法類似，在部署之前需要安裝JDK、Android SDK到開發環境中，配置好JDK的JAVA_HOME和Android SDK的ANDROID_HOME到環境變量中去，并把Android SDK安裝目錄添加到Path中。?
配置好之后打開PowerShell輸入命令返回正確：

adb version

接下來就簡單了，把手機連接到電腦，并開啟usb調試模式，執行命令：

ionic run android

Ionic開始編譯項目生成apk并遠程安裝到手機上后自動打開應用，是不是很簡單？

IOS?
ios部署需要一臺mac電腦，在mac電腦上面根據本篇ionic的安裝過程安裝環境之后，添加ios平臺到項目，因為apple開發的證書限制我們在沒有申請購買apple賬號的情況下，使用虛擬機來部署我們的應用，在部署之前需要使用npm安裝一個ios-sim插件用來調用模擬器的，執行命令：

sudo npm install -g ios-sim

安裝好之后，cd 到開發目錄下執行：

sudo ionic build ios

4.調試

我們在前面已經說過，在開發前期我們一般會在web中調試，而Ionic為我們提供了非常方面的web調試環境，只需要執行ionic serve就可以實現lievereload，而在部署到移動端后也可以開啟livereload的，我們只需要修改下我們run命令參數：

ionic run android --livereload -c -s

·?????? 1

這是android的調試模式，無論在虛擬機上還是在手機上都可以實現livereload，ios則只需要把android修改為ios即可，不用每次開發完成編譯再部署！-c是開啟客戶端日志輸出，-s是開啟服務器端日志輸出。–livereload參數的的意義在于修改生成包中的起始頁面地址，修改為遠程服務器地址這樣就可以做到修改即通知客戶端刷新頁面了。

5.ios打包、android打包

能使用Ionic來開發app的很可能對Ios和android的app打包發布流程不是很熟悉，我這里簡單說明下：?
Android?
Android的打包比較簡單執行命令：

ionic build android -release 

·?????? 1

找到www/platform目錄下生成的apk包，此時的apk還不能被安裝到手機上，還需要一步簽名操作，大家可以參考：?
http://www.cnblogs.com/qianxudetianxia/archive/2011/04/09/2010468.html

IOS?
ipa文件的打包需要現在apple develop網站上注冊一個賬號，在網站申請生產環境的證書導入到你的開發機中和開發機綁定才可以使用xcode導出，詳情參閱：?
http://blog.csdn.net/songrotek/article/details/8448331?
http://www.mexiqq.com/2014/07/25/xcode6+ios8%E6%9C%80%E6%96%B0%E7%9C%9F%E6%9C%BA%E8%B0%83%E8%AF%95%E6%95%99%E7%A8%8B/

?

http://cordova.apache.org/docs/en/5.1.1/guide/platforms/android/index.html