溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

最新版Cordova 5.3.1(PhoneGap)搭建開發(fā)環(huán)境

發(fā)布時間:2020-08-10 03:30:38 來源:網絡 閱讀:1349 作者:leslies2 欄目:移動開發(fā)

引言

簡單介紹一下Cordova的來歷,Cordova的前身 叫PhoneGap,自被Adobe收購后交由Apache管理,并將其核心功能開源改名為Cordova。它能讓你使用HTML5輕松調用本地API接 口和發(fā)布應用到商店的應用開發(fā)平臺。有低成本,低開發(fā)周期,輕量化等優(yōu)點。它統(tǒng)一封裝了 Andriod,IOS,WindowsPhone,Symbian等幾大移動開發(fā)平臺的API,采用HTML5+JavaScript的混合開發(fā)的模式 來開發(fā)智能移動的APP,解決系統(tǒng)兼容等問題。使用Cordova把APP從一個平臺移植到另外一個平臺只需要把HTML代碼跟JS打包一下就可以了,減 少了大量的開發(fā)成本與開發(fā)時間,因此受到廣大企業(yè)與開發(fā)人員的青睞?,F(xiàn)在不少的大型網站(例如京東,淘寶等)手機APP都是使用此種混搭模式進行開發(fā)。

詳細說明可看Cordova的官方網站 http://cordova.apache.org/

 

 

目錄

一、軟件下載

二、JDK安裝部署

三、Android SDK 安裝部署

四、Cordova/PhoneGap 安裝部署

五、建立Cordova 測試項目

 

 


一、軟件包下載

運行環(huán)境:Windows 7

  1. JDK 7 下載:http://www.oracle.com/technetwork/java/javase/downloads/index.html

  2. Android SDK 下載:http://android-sdk.en.softonic.com/

  3. ADT-23.0.6下載:http://tools.android-studio.org/

  4. Node-v4.1下載:https://nodejs.org/dist/latest/node-v4.1.0-x64.msi

  5. Ant-1.9.6下載:http://apache.fayea.com//ant/binaries/apache-ant-1.9.6-bin.zip

回到目錄

 

二、JDK安裝部署

JDK (Java Development Kit) 是 Sun 針對Java開發(fā)員的產品,是現(xiàn)今使用最廣泛的Java SDK。JDK 是整個Java的核心,包括了Java運行環(huán)境和基礎類庫等。常用版本包括 JDK 6、JDK 7、JDK 8。

成功安裝 JDK 7 后,必須設置環(huán)境變量,讓系統(tǒng)感知并能調用 JDK 7。

最新版Cordova 5.3.1(PhoneGap)搭建開發(fā)環(huán)境

打開 “控制面板 --> 系統(tǒng)安全 --> 系統(tǒng) --> 高級系統(tǒng)設置 --> 環(huán)境變量”,增加以下配置 :

變量說明
java_homeC:\ jdk7.win32.x86_64_1.7.0.u45寫入JDK安裝的路徑
Path;%java_home%\bin在Path原有值上加入此值
classpath;%java_home%\lib\dt.jar;%java_home%\lib\tools.jar在classpath的原有值上加入此值

 回到目錄


三、Android SDK 安裝部署

如果通過Eclipse來開發(fā)Andorid應用程序,配置好了JDK變量環(huán)境之后可以安裝Eclipse,然后下載Android SDK(Software Development Kit)并在Eclipse中安裝ADT插件,這個插件能讓Eclipse和Android SDK關聯(lián)起來。

3.1 ADT安裝

ADT 全名 Android Development Tools, 使用Eclipse開發(fā)Android,在Eclipse編譯IDE環(huán)境中安裝ADT,可以為Android開發(fā)提供開發(fā)工具的升級或者變更,方便 Android SDK等版本的管理。當然,如果使用Android Studio等開發(fā)工具,ADT可無需安裝。

最新版Cordova 5.3.1(PhoneGap)搭建開發(fā)環(huán)境
由于中國的特殊情況,防護墻把Google官網給封了,所以在Eclipse Marketplace中直接下載ADT,將出現(xiàn)類似 “Unable to connect to repository http://dl-ssl.google.com/android/eclipse/content.xml ” 等錯誤。此時除了使用代理外,修改hosts等方法外,還可使用以下方法進行安裝。
首先在 http://tools.android-studio.org/ 下載ADT-23.0.6.zip包,打開菜單Help-InstallForSite

最新版Cordova 5.3.1(PhoneGap)搭建開發(fā)環(huán)境

直接選擇已下載的ADT-23.0.6.zip包

最新版Cordova 5.3.1(PhoneGap)搭建開發(fā)環(huán)境

安裝完成后,你可以看到新建項目時出現(xiàn)Android選項

最新版Cordova 5.3.1(PhoneGap)搭建開發(fā)環(huán)境

 

3.2 部署環(huán)境變量

把下載的Android SDK解壓后,新建系統(tǒng)變量,操作類似于JDK1.7系統(tǒng)變量設置。選 擇“系統(tǒng)變量”中變量名為“Path”的環(huán)境變量,變量后追加 “;D:\MyEclipse Professional 2014\android-sdk-windows\tools;D:\MyEclipse Professional 2014\android-sdk-windows\tools\platform-tools;”

3.3 安裝Android SDK

官網上下載Android SDK后,直接打開SDK Manager

最新版Cordova 5.3.1(PhoneGap)搭建開發(fā)環(huán)境

由于中國的特殊情況,防護墻把google官網給封了,所以下載前須打開菜單Tools-Options設置代理,否則會出現(xiàn) “Fetching https://dl-ssl.google.com/android/repository/addons_list-2.xml” 等錯誤

最新版Cordova 5.3.1(PhoneGap)搭建開發(fā)環(huán)境

HTTP Proxy Server設置為:android-mirror.bugly.qq.com 
HTTP Proxy Port設置為:8080
也可參考網站 http://tools.android-studio.org/

最新版Cordova 5.3.1(PhoneGap)搭建開發(fā)環(huán)境

選擇所需要的Android版本進行下載,如果下載版本多所占用的空間可能比較大,用的時間也比較長。個人下載了Android 5.1、Android 4.4、Android4.1.2等幾個版本,需要大約20G左右。

3.4 綁定Android SDK

打開菜單 windows-preferences ,選擇Android項目,把SDK Location綁定到 Android SDK 所在的文件夾,可看到剛剛所下載的各個Android SDK 版本

最新版Cordova 5.3.1(PhoneGap)搭建開發(fā)環(huán)境

 回到目錄


四、Cordova/PhoneGap 安裝部署

在官網下載最新版 Node-v4.1,完成安裝后,在環(huán)境變量中把path增加配置 “ ;C:\Program Files\nodejs\;”
為了方便管理,建議為Eclipse加入Ant插件。在Ant 官網下載 Ant-1.9.6,完成安裝后在環(huán)境變量中把path增加配置 “;D:\MyEclipse Professional 2014\apache-ant-1.9.6\bin” 。
此時,在命令提示符窗口執(zhí)行以下命令 npm install -g cordova
等待三五分鐘,完成cordova安裝后,系統(tǒng)就會出現(xiàn)以下提示:

最新版Cordova 5.3.1(PhoneGap)搭建開發(fā)環(huán)境

注意:Cordova 對 Android SDK 的版本是有要求的,如果需要控制所安裝的版本,可使用命令

npm install -g cordova@****  (版本號)

 回到目錄


五、建立Cordova 測試項目

5.1 建立Android工程基礎文件

輸入命令 “cordova create AndroidFiles com.sun.androidapp AndroidTest” ,建立工程文件。
其中AndroidFiles是文件夾名稱,com.sun.androidapp是包名稱,AndroidTest是工程名稱

最新版Cordova 5.3.1(PhoneGap)搭建開發(fā)環(huán)境

5.2創(chuàng)建工程實例

進入剛創(chuàng)建的文件AndroidFiles, 輸入命令 cordova platform add android 建立工程實例

最新版Cordova 5.3.1(PhoneGap)搭建開發(fā)環(huán)境

除此以外,還可以用以類似命令創(chuàng)建 iOS、WP、BlackBerrry 等平臺的實例

cordova platform add ios
cordova platform add wp7
cordova platform add wp8
cordova platform add blackberry10

同時,也可使用以下命令控制所生成實例的 Android SDK 運行環(huán)境

cordova platform add android@****  (版本號)

此時,再輸入命令 cordova build ,當出現(xiàn)BUILD SUCCESSFUL等字樣后,代表項目已成功生成

最新版Cordova 5.3.1(PhoneGap)搭建開發(fā)環(huán)境

 此時可以用幾種簡單的方式對項目進行測試

  • 瀏覽器測試

輸入命令cordova serve android, 在瀏覽器中打開相關地址 http://localhost:8000

最新版Cordova 5.3.1(PhoneGap)搭建開發(fā)環(huán)境

  • 手機測試

連接手機,選擇調試選項,輸入命令cordova run android

最新版Cordova 5.3.1(PhoneGap)搭建開發(fā)環(huán)境

 

  •  模擬器測試

輸入命令cordova emulate android

最新版Cordova 5.3.1(PhoneGap)搭建開發(fā)環(huán)境


5.4項目編輯配置

打 開Eclipse,導入剛創(chuàng)建的工程,工程中包含兩個項目,一個是CordovaLib,一個是MainActivity。MainActivity為測 試項目,CordovaLib 為Cordova 的源代碼項目。 首先選擇項目屬性,設置Android所運行的基礎平臺。

最新版Cordova 5.3.1(PhoneGap)搭建開發(fā)環(huán)境

注意:Cordova 5.3.1 中 CordovaLib 要求運行在 Android SDK 5.1.1, API Level 22或以上,否則某些API將報錯,MainActivity 運行的平臺版本則可以按需要而設。

最新版Cordova 5.3.1(PhoneGap)搭建開發(fā)環(huán)境

另外,JDK 1.7要求Android SDK 版本為API Level 17或以上,若選擇運行16或者以下運行環(huán)境,系統(tǒng)將會出現(xiàn)以下錯誤。此時可設置項目屬性,把運行環(huán)境設計為JDK 1.6 以解決問題。

最新版Cordova 5.3.1(PhoneGap)搭建開發(fā)環(huán)境

一般在Eclipse使用Android Virtual Device (AVD) 虛擬器進行項目測試,在運行測試前,先配置運行環(huán)境。選擇Target->Manager

最新版Cordova 5.3.1(PhoneGap)搭建開發(fā)環(huán)境

按下Create鍵,配置一臺Android虛擬器,用戶可根據實際情況配置多臺Android虛擬機。

最新版Cordova 5.3.1(PhoneGap)搭建開發(fā)環(huán)境

完成配置后,選擇Start,啟動Android虛擬器

 最新版Cordova 5.3.1(PhoneGap)搭建開發(fā)環(huán)境

啟動調試后,選擇你所配置的虛擬機即可運行,在此Cordova的環(huán)境部署已經大功告成了,你可以在Eclipse中使用HTML5+Javascript方式完成Android開發(fā)了。

 

回到目錄

 

 

本章小結

使 用Cordova/PhoneGap,應用程序的構建可以無需本地代碼,直接使用的是Web技術即可。由于這些API在多個設備平臺上是一致的,都是基于 HTML5 Web標準創(chuàng)建,因此應用程序的移植很方便。Cordova支持iOS、Android、Blackberry、Windows Phone、Palm WebOS、Bada和Symbian等多個平臺,只需要使用平臺SDK打包成應用程序,可以從每種設備的應用程序商店下載安裝。因此,Cordova將 成為未來手機混合開發(fā)的新趨勢。

 

 

參考文章

Cordova(PhoneGap)通過CordovaPlugin插件調用 Activity 實例

Apache2.2+Tomcat7.0整合配置詳解

Windows Server 2008 R2 負載平衡入門篇

最新版Cordova 5.1.1(PhoneGap)搭建開發(fā)環(huán)境

 

 

作者:風塵浪子

http://www.cnblogs.com/leslies2/p/4819008.html

原創(chuàng)作品,轉載時請注明作者及出處


向AI問一下細節(jié)

免責聲明:本站發(fā)布的內容(圖片、視頻和文字)以原創(chuàng)、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯(lián)系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。

AI