Cordova 3.x+ 基础 -- 环境搭建（Windows / Android）
1. PhoneGap(Cordova)
Mobile App分为三大类：Native App,HybridApp,Web App。其中Hybrid App介于Native App和Web App之间，它能兼顾Native App的良好用户体验及强大的功能并具有WebApp跨平台快速开发的优势。缺点在于依赖于各平台的WebView，WebView的性能好坏直接决定了Hybrid App的性能。
目前国内外的HybridApp开发框架很多，比较有代表的是国外的Cordova(akaPhoneGap)、Sencha Touch、Titanium、Intel XDK、RhoMobile、Xamarin等和国内的AppCan、Rexsee、xFace，而Dr. Dobb's Journal颁布的2014年度移动开发工具类Jolt大奖中 PhoneGap和Titanium获得Jolt生产力奖。Titanium应该属于Web到Native的Converter，还有一种就是 NativeJavaScript的应用，比如Chrome Apps／Firefox OS／Windows 8 apps。 基于开源的Cordova，各大公司都推出了自己的产品，比如：AdobePhoneGap、Oracle ADF Mobile、SAP Kapsel、IBM Worklight、Microsoft的Visual Studio也支持Cordova。
2. 安装运行
（1）前提环境
安装Ant，把%ANT_HOME%\bin加到Path环境变量中，不然会报Error “executing command 'ant'”错。
引用
ant -h
ant -version
安装AndroidSDK，把%ANDROID_HOME%\tools;%ANDROID_HOME%\platform-tools加到Path环境变量中，不然会 报"Error:An error occurred while listing Android targets"错，并提前创建好一个AVD。
引用
android -h
adb version
android list avd
安装
引用
node -v
npm -v
如果需要从git地址安装插件，好需要安装
引用
git --version
（2）安装PhoneGapCordova CLI
引用
> npm install -g phonegap
> npm install -gcordova
安装路径：
C:\Users\YourDomain\AppData\Roaming\npm\node_modules\cordova
更新Cordova版本
引用
npm update cordova –g
如果安装速度很慢的话可以设置代理：
引用
npm config set proxyhttp://xx.xx.xx.xx:xxxx
npm config set https-proxy http://xx.xx.xx.xx:xxxx
npm config list
或者使用国内的镜像站：
引用
npm config set registryhttp://registry.cnpmjs.org
npm info cordova
npm --registry http://registry.cnpmjs.org info cordova
（3）创建并运行project
a.进入需要放置工程的文件夹pro，并进入
引用
> cd C:\...\pro
b.创建一个“myapp”工程，包命为com.yourname.myapp，标题为MyApp
引用
> cordova create myapp “com.yourname.myapp” MyApp
c.进入工程目录
引用
> cd myapp
d.添加平台支持
引用
> cordova platforms addios
> cordova platforms add android
> cordova platforms ls(查看安装了哪些平台)
CLI使用各个平台的SDK来创建工程。
更新Cordova工程平台的版本
cordova platform check如果有类似“android @ 3.3.0 could be updatedto: 3.4.0”的提示可以执行更新
也可以查看platforms\android\assets\www\cordova.js确认当前版本信息
cordova platform update android如果提示“All platforms are up-to-date.”说明不需要更新。
e.添加插件
引用
> cordova plugin searchkeyword（搜索相关keyword插件）
> cordova plugin addorg.apache.cordova.device
> cordova plugin add org.apache.cordova.console
> cordova plugin ls
插件可以从很多地方安装：
第三方插件库：http://plugins.cordova.io/#/
插件名（从plugin repository下载）：cordova plugin add org.apache.cordova.console
git地址：cordova plugin addhttps://git-wip-us.apache.org/repos/asf/cordova-plugin-camera.git
本地地址：cordova plugin addd:\cordova-3.3.0\cordova-plugin-camera
本地文件：cordova plugin add plugin.tar.gz
指定版本
cordova plugin add org.apache.cordova.console@0.2.1
cordova plugin add https://github.com/apache/cordova-plugin-console.git#r0.2.0
cordova plugin add https://github.com/someone/aplugin.git#:/my/sub/dir
cordova plugin add https://github.com/someone/aplugin.git#r0.0.1:/my/sub/dir
等等
f.编译代码
引用
> cordova build android
g.运行代码
在模拟器上运行（前提是创建好AVD）
引用
> cordova emulateandroid
Windows
下
convert
命令冲突，直接
“cordova emulate android”
会报
Error: spawn ENOENT
，需要先启动模拟器。
h.在浏览器运行（服务器）
引用
> cordova serve android
浏览器访问地址：http://localhost:8000/，就可以和调试页面一样调试app的布局了。如果app中使用了cordova的NativeAPI调用，会弹出以下对话框：
这是因为浏览器无法提供@JavascriptInterface的接口，Cordova视图通过prompt()和Native交互，这样做是因为
Android2.3 simulator的Bug。所以调试页面布局，无视即可。
i.通过USB直接安装到真机
引用
> cordova run android
（注：可用PhoneGap指令替换，如下：
$ phonegap create yourProjectName “com.example.yourpackage” yourProjectTitleName
$ cd yourProjectName
$ phonegap run android （run + 平台，表示在那个平台下运行编译））
3. 常用命令
（1）create <directory> [<id> [<name>]]
创建一个cordova工程，id为package名。
（2）platform [ls | list]
列出该工程支持哪些平台
（3）platform add <platform> [<platform> ...]
为工程添加一个或多个平台支持
（4）platform [rm | remove] <platform> [<platform>...]
删除该工程的某个平台支持
（5）platform [up | update] <platform>
更新该工程某个平台的Cordova版本
（6）plugin [ls | list]
列出该工程包含哪些插件
（7）plugin add <path-to-plugin> [<path-to-plugin>...]
为工程添加一个或多个插件
（8）plugin [rm | remove] <plugin-name>[<plugin-name> ...]
从该工程中删除某个插件
（9）plugin search [<keyword1> <keyword2> ...]
根据关键字从registry中搜索插件
（10）compile [platform...]
编译指定平台的app包
（11）build [<platform> [<platform> [...]]]
先做prepare（拷贝文件）后做compile
（12）emulate [<platform> [<platform> [...]]]
启动模拟器运行应用
（13）serve [port]
启动本地web服务来访问www，默认端口是8000
引用
platform和platforms等价
plugin和plugins等价
详细的内容可以通过cordova help命令查看。
目录结构
（1）目录一览：
引用
myApp/
|-- config.xml
|-- hooks/
| | |-- before_xxx/
| | `-- after_xxx/
|-- merges/
| | |-- android/
| | `-- ios/
|-- platforms/
| |-- android/
| `-- ios/
|-- plugins/
| |-- org.apache.cordova.console/
| `-- org.apache.cordova.device/
|-- www/
| |-- css/
| |-- img/
` |-- js/
`-- index.html
（2）config.xml
cordova的配置文件
（3）hooks目录
存放自定义cordova命令的脚本文件。每个project命令都可以定义before和after的Hook，比如：before_build、after_build。
Hook可以采用任何编程语言来写，Cordova CLI采用的是Node.js，所以一般都是用它来写。
这里提供了3个常用的Hook脚本：
http://devgirl.org/2013/11/12/three-hooks-your-cordovaphonegap-project-needs/
（4）merges目录
存放各个平台特殊的文件，会和www进行合并编译，相同的文件merges下的文件优先。
比如：
引用
merges/
|-- ios/
| `-- app.js
|-- android/
| `-- android.js
www/
`-- app.js
编译成iOS应用的话，包含merges/ios/app.js；而Android应用的话，包含www/app.js、merges/android/android.js
（5）platforms目录
各个平台的原生代码工程，不要手动修改，因为在build的时候会被覆盖。
（6）plugins目录
插件目录（cordova提供的原生API也是以插件的形式提供的）。
（7）www目录
源代码目录，在cordova prepare的时候会被copy到各个平台工程的assets\www目录中。
其中index.html为应用的入口文件。
