Phonegap+XCode Mac OS 環境搭建

本篇博文給你們介紹如何在Mac OS中配置Phonegap的開發環境。

配置各類開發環境：

1.Java JDK

jdk1.7.0_80

2.Android SDK

1.啓動Terminal終端工具
2.輸入cd ~/ 進入當前用戶的home目錄
3.建立：touch .bash_profile
4.打開並編輯：open .bash_profile
五、在文件中寫入如下內容：export PATH=${PATH}:/Users/sxpmg/Application/android-sdk-mac_x86/tools:/Users/sxpmg/Application/android-sdk-mac_x86/platform-tools 
其中：/Users/sxpmg/Application/android-sdk-mac_x86/tools不是固定的，它指向android SDK的tools目錄，/Users/sxpmg/Application/android-sdk-mac_x86/platform-tools指向android SDK的platform-tools目錄，也是根據具體狀況而定。這只是我配置的時候所用的路徑而已。 
六、執行以下命令：source .bash_profile 
七、驗證：輸入adb回車。若是未顯示command not found，說明此命令有效，環境便亮設置完成。

具體怎麼在Mac OS中配置環境變量，可參考：http://www.cnblogs.com/lee0oo0/archive/2013/06/10/3131341.html

3.Ant 打包工具

apache-ant-1.9.7
http://ant.apache.org/bindownload.cgi

4.Xcode （AndroidStudio）

5.Node.js

https://nodejs.org/en/

各類環境變量的配置

export PATH=${PATH}:/opt/apache-ant-1.9.7/bin

安裝Phonegap

啓動Terminal終端工具

Mac使用: sudo npm install -g phonegap

Mac使用: sudo npm install -g cordova

提醒：這段時間會比較長，我大概安裝了有20分鐘左右，因此這步須要你們耐心等待。

開始建立Phonegap的IOS應用程序

這步其實和Windows的建立步驟一致，只是build不同的平臺而已。因此這邊就不細講了。

進入你要建立的項目目錄，而後建立phonegap項目。
$ cordova create hello com.example.hello HelloWorld
輸入完這個命令後cordova程序會幫你建立hello文件夾，裏面就是這個phonegap環境了。
建立xcode項目文件。要編譯App確定是要用xcode的，沒有安裝就去App Store下載吧。
$ cd hello
$ cordova platform add ios
以後你用finder進入子目錄就會看到platforms中得ios文件夾，接着你就運行裏面項目編譯便可。

接下來說講前一篇博文沒講到的內容，如何調用不少系統的東西，好比攝像頭、系統信息、文件操做等等，或者第三方開發的插件？

Basic device information (Device API): (設備信息插件)

$ cordova plugin add org.apache.cordova.device
Network Connection and Battery Events:（網絡鏈接插件）

$ cordova plugin add org.apache.cordova.network-information
$ cordova plugin add org.apache.cordova.battery-status
Accelerometer, Compass, and Geolocation:（陀螺儀）

$ cordova plugin add org.apache.cordova.device-motion
$ cordova plugin add org.apache.cordova.device-orientation
$ cordova plugin add org.apache.cordova.geolocation
Camera, Media playback and Capture:（攝像頭拍照錄制等）

$ cordova plugin add org.apache.cordova.camera
$ cordova plugin add org.apache.cordova.media-capture
$ cordova plugin add org.apache.cordova.media
Access files on device or network (File API):（訪問文件）

$ cordova plugin add org.apache.cordova.file
$ cordova plugin add org.apache.cordova.file-transfer
Notification via dialog box or vibration:（提醒）

$ cordova plugin add org.apache.cordova.dialogs
$ cordova plugin add org.apache.cordova.vibration
Contacts:（聯繫人）

$ cordova plugin add org.apache.cordova.contacts
Globalization:

$ cordova plugin add org.apache.cordova.globalization
Splashscreen:

$ cordova plugin add org.apache.cordova.splashscreen
Open new browser windows (InAppBrowser):

$ cordova plugin add org.apache.cordova.inappbrowser
Debug console:

$ cordova plugin add org.apache.cordova.console

至此，Phonegap+XCode Mac OS下的開發環境就搭建完畢。祝各位順利完成環境的配置。

 

Thanks

Jack