1. 程式人生 > >Window 系統下安裝cordova (用於Android開發)

Window 系統下安裝cordova (用於Android開發)

因為前段時間開發的Android專案要用到cordova與H5進行互動,翻查了不少網站,故此寫一遍部落格來鞏固一下。若有寫不好之處請勿噴,謝謝!

Android開發的程式設計師,JDK與ADT以及SDK的環境配置就不需要介紹了,這些環境少不了!下面來講cordova安裝的步驟:
第一步:安裝Ant
Ant具有自動編譯打包android專案的功能。此處給出官網下載地址http://ant.apache.org/bindownload.cgi
下載完解壓之後得要配置環境,方法如下:
  變數: ANT_HOME 新增值: 剛解壓到的路徑:E:\apache-ant-1.9.6-bin\
  變數: Path 新增值:%ANT_HOME%\bin
新增完成之後需要驗證是否新增成功,檢驗方法如下:
在cmd命令列視窗輸入ant,若出現
Buildfile: build.xml does not exist!
Build failed
或BUILD SUCCESSFUL則代表成功
如右圖:這裡寫圖片描述


第二步:安裝 node.js
因為cordova的安裝少不了node.js中的npm,自然是先安裝node.js。官網連結:http://nodejs.org/
在官網找到對應的檔案下載安裝,安裝完成之後需要確認安裝的完成是否成功。檢驗方法:在cmd命令列視窗輸入:npm -v 或npm -version
若出現版本號即代表安裝成功。
例圖如右:檢驗node.js是否安裝成功的判斷

第三步:用npm命令安裝cordova
安裝方法:在cmd命令列視窗輸入:npm install -g cordova
例圖如右:cordova安裝命令
安裝過程會等待比較長的時間,當然,這取決於你的網路,當安裝完的時候就會出現很多資料。例圖如下:
這裡寫圖片描述
此時我們就可以輸在cmd命令列視窗輸入命令來檢驗是否安裝成功。
在cmd命令列視窗輸入命令如右:cordova -v或者cordova -version
若出現版本號即代表安裝成功。
例圖如右:這裡寫圖片描述

我們這樣安裝的cordova是最新版本的,如需安裝其它版本,只需要在命令列npm install -g cordova後面加上“@版本號”就可以了。
例如安裝5.4.1的版本:npm install -g [email protected]

因為cordova安裝的版本是與android sdk版本有關的,我安裝的是cordova 6.0.0,所有必須使用sdk版本android-23。如果你的sdk版本過低,可以考慮安裝低一點版本的cordova。注意:這一定是相對應的!

這裡也講一下cordova的解除安裝命令,如果你不想用cordova或者是cordova安裝錯誤可在cmd命令列視窗執行命令:npm uninstall cordova -g即可解除安裝cordova
例圖如右:這裡寫圖片描述

第四步:建立cordova專案
轉到想要建立專案的目錄碟符,例如d:則可以進入d盤
然後執行:cordova create cordovacheck com.example.test
如下圖:
這裡寫圖片描述
這時我們在d盤下就能夠找到cordovacheck的資料夾。
接著在cmd命令列視窗執行命令進入cordovacheck資料夾
然後新增Android平臺,命令為:cordova platform add android
例圖如下:
這裡寫圖片描述

當然除了android平臺,你也可以新增其他的平臺:
cordova platform add wp8
cordova platform add windows
cordova platform add amazon-fireos
cordova platform add android
cordova platform add blackberry10
cordova platform add firefoxos\
解除安裝平臺命令:
cordova platform rm ios
cordova platform rm firefoxos
cordova platform rm windows
cordova platform rm wp8
cordova platform rm firefoxos
cordova platform rm android
檢視自己已經安裝的平臺以及未安裝的平臺:
cordova platforms ls
例圖如下:
這裡寫圖片描述
增加外掛:
官網外掛連結:http://cordova.apache.org/plugins/?platforms=cordova-android

例如想新增phonegap-plugin-contentsync這個外掛:
這裡寫圖片描述
直接在cmd命令列視窗執行命令:phonegap plugin add phonegap-plugin-contentsync
例圖如下:
這裡寫圖片描述

新增cordova-plugin-camera外掛:
這裡寫圖片描述
直接在cmd命令列視窗執行命令:
例圖如下:
這裡寫圖片描述
自己想新增什麼外掛都可以去找來新增,很簡單的。
在D:\cordovacheck\plugins目錄下就可以看到剛剛新增的外掛了
這裡寫圖片描述

你寫好的html、css、js檔案可以放到剛剛建立目錄下的www檔案所對應的位置。例如:D:\cordovacheck\www
這裡寫圖片描述

此時在D:\cordovacheck\platforms\android下面就可以看到Demo了!
您的Android cordova開發之路從此就可以開始了!
這裡寫圖片描述

如若您覺得寫的不好,望請提出,請見諒,謝謝!