Mac 10.9x下安裝配置phonegap3.0開發環境 (涉及android sdk配置)

池中物willian發表於2014-01-12

最近突然想弄一下phonegap,之前一直是聽說,沒親自配置開發過。結果配置過程非常艱難啊。特別是android平臺的配置,那叫一個麻煩,網上搜了半天都沒找到非常好的資料。文章也都是抄來抄去,最煩的就是抄來抄去的文章,沒親自測試過就轉發了,你轉發個毛線啊。事實證明還是得自己親自解決,花了兩天時間終於搞定。

寫下這篇文章希望對想開發phonegap的同學有所幫助。

最新的phonegap貌似用的是nodejs開發的

共有以下幾個步驟:

安裝nodejs環境、安裝phonegap、安裝xcode、安裝android SDK

 

跟我進入安裝phonegap的艱難之旅吧。。文章有點長不喜勿看

安裝phonegap3.0需要事先安裝nodejs環境,nodejs安裝非常簡單。直接上nodejs官網下載一個安裝包,開啟安裝即可,安全沒有難度,我就不說了。 

安裝完nodejs後,開啟Terminal命令列工具輸入

$ sudo npm install -g phonegap

等待片刻即安裝成功

再當前目錄建立hello專案

建立phonegap專案名字暫時就叫helloworld吧,cordova即phonegap是由於adobe收藏原phonegap後另外取的名字而已

hello即專案名,com.example.hello為(id)名稱空間, HelloWorld即APP名稱 

$ cordova create hello com.example.hello HelloWorld

新增要編譯的平臺

即專案開發完後要編譯出哪些平臺的APP,如ios平臺,android平臺,Blackberry平臺等,詳情支援哪些平臺請看這裡

http://docs.phonegap.com/en/edge/guide_platforms_index.md.html#Platform%20Guides

 

進入hello專案目錄

$ cd hello

新增ios平臺

$ cordova platform add ios

在當前目錄下應該就可以看到如下檔案結構

 

 

建立ios平臺專案

$ cordova build ios

成功後你就可以看到

 

雙擊HelloWorld.xcodeproj這個檔案就可以開啟這個專案進行測試了

 

 

接下來就可以在xcode中正常的編譯、輸出、釋出到appstore上了,前提是您得有開發者帳號哈。新增ios平臺是如此的簡單

 

接下來是

新增android平臺

$ cordova platform add android

如果你在執行此條命令前沒有安裝並配置正確的android SDK那麼應該會報錯,我這邊報這樣的錯誤如圖

 

 

錯誤提示意思是大概是沒有安裝並正確配置android SDK

 

所以得在建立android平臺之前先得去google下載最新的android SDK並新增至全域性環境中

下載android SDK的網頁可能需要翻一下牆

下載到最新的SDK開發包解壓並放到某個目錄下,我是放在了User目錄下的Development目錄下,Development是自己建的如圖

 

 

由於下載的最新SDK只是個基本環境,你還得雙擊tools目錄下的android程式android SDK manager來下載更新安裝你需要的N個android版本可能會花點時間喲,如圖勾選你需要使用的版本,我是選了好多個的:

 

 

更新完SDK後得配置Android Virtual Device Manager即傳說中的AVD也就是android虛擬機器

 

雙擊tools目錄下的monitor程式,monitor然後點選window選單下的monitor開啟AVD管理器如圖

 

 

 

AVD中點選new按鈕,根據自己需要配置一個新的android虛擬器

好了,至此android SDK安裝完了。

 

android SDK目錄新增到全域性環境中

Terminal中輸入

open ~/.bash_profile

開啟檔案後輸入這兩行

export PATH=/Users/willian/Development/android-sdk-macosx/platform-tools:$PATH

export PATH=/Users/willian/Development/android-sdk-macosx/tools:$PATH

具體的目錄需要更改為你放置android SDK的正確目錄

儲存檔案

並在Terminal內輸入

source ~/.bash_profile

此命令是剛剛的配置命令以即刻生效

好了,android的所有配置完成了。

 

繼續執行命令

$ cordova platform add android

發現還是不能新增成功,如圖

 

錯誤提示說是沒有安裝ant, 好吧,繼續安裝ant

安裝ant請先確保homebrew已經安裝了,這個東西您應該懂的,安裝一些程式時非常實用,首先請勿必更新homebrew否則安裝ant命令在mac ox 10.9內是不識別的

$ brew update

再安裝ant

$ brew install ant

發更還是報錯,還得安裝Command Line Tools

繼續執行

$ xcode-select –install

然後再執行

$ brew install ant

應該就安裝成功瞭如圖

至此執行

$ cordova platform add android

新增android平臺就可以成功了

在檔案目錄下應該可以看到如圖

 

 

使用eclipse就可以直接匯入專案

 

Terminal中輸入

$ cordova build android

即可編譯出apk檔案在hello/platforms/android/bin目錄下可以找到

 

在模擬器中執行

$ cordova emulate android

 

安裝apk至android手機

$ phonegap install android

 

 

至此ios與 android平臺的配置都已經OK了。Android的配置真是蛋疼啊。

 

如果安裝中碰到任何問題,請與我交流心得。謝謝 

 

 

========================================================

轉載處請註明:部落格園偷飯貓willian12345@126.com

相關文章