官方安裝文檔地址:
http://cordova.apache.org/#getstarted
1 安裝nodejs(已經安裝了的請跳過這一步)
nodejs官網
https://nodejs.org/en/
可以去官網下載最新安裝包,然後按步驟安裝
安裝完畢後,打開cmd,
輸入
node -v
可查看node版本
輸入
npm -v
可查看npm版本
2 用nodejs的npm安裝cordova
打開cmd,輸入
npm install -g cordova
3 創建項目
cordova create <path> <package_name>
例如:
cordova create F:/cordova/test1 jane.cordova.test
注意:如果不輸入<package_name>,包名將是默認的io.cordova.hellocordova
4 進入項目目錄
例如:
F:\cordova\test1>
5 添加支持的平臺
cordova platform add ios --save
cordova platform add android --save
cordova platform add browser
6 確定browser環境可以運行
cordova run browser
如果報找不到chrome的錯誤,需要把chrome加入環境變量(cordova默認會拉起chrome作爲瀏覽器運行)
添加環境變量:
開始->計算機->右鍵屬性->高級系統設置->高級->環境變量->系統變量->path 添加chrome安裝的目錄(exe文件的目錄路徑)
7 檢查依賴項是否安裝齊全
cordova requirements
由於是windows平臺,所以,只能編譯android的包,ios的報錯和警告都可以忽略,browser只是預覽,所以只要第六步可以正常運行即可
Requirements check results for android:
Java JDK: installed .
Android SDK: not installed
Failed to find 'ANDROID_HOME' environment variable. Try setting setting it manually.
Failed to find 'android' command in your 'PATH'. Try update your 'PATH' to include path to valid SDK directory.
Android target: not installed
Android SDK not found. Make sure that it is installed. If it is not at the default location, set the ANDROID_HOME environment variable.
Gradle: not installed
Could not find gradle wrapper within Android SDK. Could not find Android SDK directory.
Might need to install Android SDK or set up 'ANDROID_HOME' env variable.
Requirements check results for ios:
Apple OS X: not installed
Cordova tooling for iOS requires Apple OS X
Error: Some of requirements check failed
以上的結果請根據實際結果進行處理
官網對於android平臺安裝的指導:
http://cordova.apache.org/docs/en/latest/guide/platforms/android/index.html
在這一步常會遇見的問題:
7.1 Java JDK未安裝
從官網下載後,直接安裝即可
http://www.oracle.com/technetwork/java/javase/downloads/jdk7-downloads-1880260.html
如果自行選擇了安裝位置,請注意之後將JAVA_HOME配置到全局變量中
新建
key: JAVA_HOME
value: {JAVA的jdk路徑}
7.2 Android相關SDK未安裝(以下三個有未安裝部分)
Android SDK: installed
Android target: installed android-21,android-22,android-23,android-24
Gradle: installed
從Android官網下載Android Studio,Cordova官網中對於Android相關安裝有提到可以安裝 Android Stand-alone SDK Tools ,而不安裝 Android Studio,實際在Android的官網上未找到
Android官網下載Android Studio地址:(需要翻牆)
https://developer.android.com/studio/install.html?pkg=tools
安裝完畢後,打開Android Studio,點擊右下角 Configure,選擇SDK Manager,在SDK Platform中,必須包含Android 6.0(即Android-23),否則cordova會報錯,需要安裝的特定版本,在版本前打鉤後點擊右下角apply即會開始安裝
如果自行選擇了安裝位置,請注意之後將ANDROID_HOME配置到全局變量中
新建
key: ANDROID_HOME
value: {Android的sdk路徑}
在path中編輯添加 platform-tools 和 tools 路徑,例如:
F:\Android_SDK\platform-tools;
以上安裝完畢後,需要重新打開cmd,重複第7步,檢查依賴項是否安裝齊全,
如果全部都已經,即可以進行下一步操作
8 連接手機,將apk包安裝到Android手機上實測
8.1 請查看手機的Android版本,確保第7步中的Android target有對應的版本(如果沒有,請回到第7步安裝)
8.2 請確保打開了開發者選項(點擊Android版本號5次可以打開開發者選項)
8.3 請確保手機允許安裝未簽名安裝包(即允許安裝非應用市場的應用/來源未知的應用)
8.4 用usb連接手機,手機會彈出是否允許usb調試,選擇允許(建議勾選一直允許此pc的調試,方便之後不要重複點)
8.5 在cmd裏輸入
cordova run android
如果apk包未被build過,或者改動了未build,cordova會先build的apk安裝包(這個時間比較久)
ANDROID_HOME=F:\Android_SDK
JAVA_HOME=C:\Program Files (x86)\java\jdk1.8.0_71
No target specified, deploying to device '1913ac9a'.
(略)
BUILD SUCCESSFUL
Total time: 22 mins 58.485 secs
Built the following apk(s):
F:/cordova/test1/platforms/android/build/outputs/apk/android-debug.apk
Using apk: F:/cordova/test1/platforms/android/build/outputs/apk/android-debug.apk
LAUNCH SUCCESS
然後手機上會自動打開已經安裝好的cordova的第一個hello cordova的應用
ps:
1 打開cmd的方法:
1.1 windows鍵+r
1.2 輸入cmd,按回車
2 配置全局變量
開始->計算機->右鍵屬性->高級系統設置->高級->環境變量->系統變量