windows7下安裝配置phonegap3.0 (cordavo)開發環境 (涉及android sdk配置)

池中物willian發表於2014-02-10

之前在mac上安裝除錯過phonegap,現在公司用的是windows7,所以不得不再進行一次windows下的配置工作,順便也寫下來了

主要麻煩的地方是要在win7下新增好幾個環境變數,這一塊地方特別要小心新增

步驟挺多的,給你打鎮強心劑,看最終成功執行效果先,我還測試整合了某個廣告聯盟的SDK,如圖:

 

開始吧...

注意:我下面如果給出的官方下載地址,請您自行去下載,因為我的win7是64位的,可能與你的有點不同。你得下載正確的安裝包

 

1、下載nodeJS,並安裝

Nodejs官方下載地址:

http://www.nodejs.org/

一步步安裝完即可

2、下載android sdk

Android sdk 下載地址:

http://developer.android.com/sdk/index.html

下載完成後解壓放置到某個資料夾內,比如我放置的資料夾是:

E:\frameworks\adt-bundle-windows-x86_64-20131030

看起來應該是這樣的:

 

此時你擁有的只是個android sdk管理器,真實的android sdk還需要進一步下載

雙擊 SDK Manager.exe會開啟sdk管理器,下載你需要的android SDK包即可,如圖:

android sdk新增至計算機全域性環境變數中

在計算機上滑鼠右擊選擇屬性開啟->系統皮膚->高階系統設定->環境變數->系統變數下點選新建按鈕,應該是這樣子的

新建

變數名:Android_Home

變數值:E:\frameworks\adt-bundle-windows-x86_64-20131030\sdk

變數值就是你剛剛放置android sdk資料夾路徑

 

再在系統變數中找到Path變數,沒有的話你自己建一個

雙擊這個變數在變數值中加入:

;%Android_Home%\tools

別忘了前面有個”;”分號....

新建

變數名:Android_adb

變數值:E:\frameworks\adt-bundle-windows-x86_64-20131030\sdk\platform-tools

同樣在Path變數中加入:

 

;%Android_adb%\

 

3、下載JAVA jdk

建議下載jdk1.6版本安裝,太高了eclipse有可能會執行不了啊親..

下載地址請自行尋找

同樣要將java加入全域性環境變數中

新建

變數名:JAVA_HOME

變數值:

D:\Program Files\Java\jdk1.6.0_39

 

我電腦上JDK的路徑,你電腦上得換成你自己存放JDK的資料夾路徑

新建

變數名:CLASSPATH

變數值:

.;%JAVA_HOME%\lib;%JAVA_HOME% \lib\tools.jar

別忘了最前面那個"."號哦

同樣在Path變數中加入:

;%JAVA_HOME%\bin;%JAVA_HOME%\jre \bin

4、下載ant

Antapache的一個專案

官方下載地址:http://mirrors.hust.edu.cn/apache//ant/binaries/apache-ant-1.9.3-bin.zip

別問啥為什麼要安裝這個,反正不裝的話在phonegap新增android平臺時會報錯

新增ant至全域性環境變數中

新建

變數名:ANT_HOME

變數值:D:\apache-ant-1.9.3

Path變數中新增:

;%ANT_HOME%\bin 

好了,該新增的系統變數基本搞定了,大工程,巨麻煩,別弄錯了。想檢查哪個專案在系統變數中有沒有新增成功,只要在cmd命令列工具中輸入那個專案的名稱回車,看有沒有反應即可,比如輸入node -v如果會顯示版本號,即說明安裝成功了

 

 

5、接下來是安裝eclipse

 

其實eclipse 不安裝也是可以的,但是強烈建議安裝,全用命令列來處理,太麻煩是不?

 

 

 

在你剛才下載android SDK時,資料夾中應該有一個eclipse了,如果沒有的話,就自己去官方下載一個吧

 

 

6、下載ADT包供eclipse使用

官方下載地址

https://dl.google.com/android/ADT-22.3.0.zip

下載完成後,開啟eclipse選擇help->Install New Software

開啟Install皮膚,點選add...按鈕,再點選archive...按鈕找到你剛才下載的zip包,確定再安裝完重啟eclipse即可

 

 

 

7、安裝phonegap3.x(cordova)

Phonegapadobe收購後就改名成cordova了,所以下面就以cordova來稱呼

cmd命令列工具中輸入

npm install -g cordova

Nodejs自會動會幫你安裝好cordova

 

8、建立cordova專案

 

開啟cmd命令列工具,定位到你需要建立專案的目錄後輸入

cordova create hello com.example.hello "helloworld"

 

意思是建議一個hello資料夾,並在資料夾內建議叫”helloworld”的cordova專案

 

com.example.hello可以說是你專案的id吧,暫時不用管

進入hello資料夾

 

cd hello

 

新增android平臺專案

 

cordova platform add android

好了hello資料夾下的platforms資料夾下已經有android專案了

 

9、用eclipse開啟android專案

開啟eclipse

選擇file選單下的import 開啟匯入皮膚

選擇android->Existing android code into workspace 再點選next

開啟Import Project皮膚,點選Browse...按鈕,找到剛才建立的hello\platforms資料夾下的android檔案

點選finish後匯入專案即可,

如圖:

 

在左側的包檢視(Package Explorer)中選擇Helloworld再點選run選單下的run

會讓你選擇以什麼樣的方式執行,選擇andorid application即可,然後會讓你選擇在哪裡執行裝置或android模擬器

 

關於如何新建android模擬器,請參考我的另一片mac下配置phonegap的博文,模擬器這一塊的配置幾乎是一樣的

Mac 10.9x下安裝配置phonegap3.0開發環境

 

傳送門:http://www.cnblogs.com/willian/p/3516613.html

 

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

 

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

轉載處請註明:部落格園(王二狗)willian12345@126.com

 

 

相關文章