Cordova 3.x 基础（1） -- 环境搭建（Windows / Android）（转）

原文地址：http://rensanning.iteye.com/blog/2016364

CordovaPhoneGap

Mobile App分为三大类：Native App,Hybrid App,Web App。其中Hybrid App介于Native App和Web App之间，它能兼顾Native App的良好用户体验及强大的功能并具有Web App跨平台快速开发的优势。缺点在于依赖于各平台的WebView，WebView的性能好坏直接决定了Hybrid App的性能。

目前国内外的Hybrid App开发框架很多，比较有代表的是国外的Cordova(aka PhoneGap)、Sencha Touch、Titanium、Intel XDK、RhoMobile、Xamarin等和国内的AppCan、Rexsee、xFace，而Dr. Dobb‘s Journal颁布的2014年度移动开发工具类Jolt大奖中PhoneGap和Titanium获得Jolt生产力奖。Titanium应该属于Web到Native的Converter，还有一种就是Native JavaScript的应用，比如Chrome Apps／Firefox OS／Windows 8 apps。

基于开源的Cordova，各大公司都推出了自己的产品，比如：Adobe PhoneGap、Oracle ADF Mobile、SAP Kapsel、IBM Worklight、Microsoft的Visual Studio也支持Cordova。

安装运行

（1）前提环境 
安装Ant，把%ANT_HOME%\bin加到Path环境变量中，不然会报Error “executing command ‘ant‘”错。

引用

ant -h 
ant -version

安装Android SDK，把%ANDROID_HOME%\tools;%ANDROID_HOME%\platform-tools加到Path环境变量中，不然会报"Error: An error occurred while listing Android targets"错，并提前创建好一个AVD。

关于API版本：

  • 3.0需要的是android-17（Android 4.2.2）
  • 3.1和3.2需要android-18（Android 4.3）
  • 3.3和3.4需要android-19（Android 4.4.2）

引用

android -h 
adb version 
android list avd

安装Node.js

引用

node -v 
npm -v

如果需要从git地址安装插件，好需要安装Git

引用

git --version

（2）安装Cordova CLI

引用

> npm install -g cordova

安装路径： 
C:\Documents and Settings\RenSanNing\Application Data\npm\node_modules\cordova

更新Cordova版本

引用

npm update cordova -g

如果安装速度很慢的话可以设置代理：

引用

npm config set proxy http://xx.xx.xx.xx:xxxx 
npm config set https-proxy http://xx.xx.xx.xx:xxxx 
npm config list

或者使用国内的镜像站：http://cnpmjs.org

引用

npm config set registry http://registry.cnpmjs.org 
npm info cordova

npm --registry http://registry.cnpmjs.org info cordova

现在最新版本：3.7.0（2014/10/01 发布）

（3）创建并运行project

a.新建一个目录pro，并进入

引用

> cd C:\pro

b.创建一个“myapp”工程

引用

> cordova create myapp com.yourname.myapp MyApp

c.进入工程目录

引用

> cd myapp

d.添加平台支持

引用

> cordova platforms add ios 
> cordova platforms add android

> cordova platforms ls

CLI使用各个平台的SDK来创建工程。

更新Cordova工程的版本 
cordova platform check 
如果有类似“android @ 3.3.0 could be updated to: 3.4.0”的提示可以执行更新 
也可以查看platforms\android\assets\www\cordova.js确认当前版本信息 
cordova platform update android 
如果提示“All platforms are up-to-date.”说明不需要更新。

e.添加插件

引用

> cordova plugin add org.apache.cordova.device 
> cordova plugin add org.apache.cordova.console

> cordova plugin ls

插件可以从很多地方安装： 
插件名（从plugin repository下载）：cordova plugin add org.apache.cordova.console 
git地址：cordova plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-camera.git 
本地地址：cordova plugin add d:\cordova-3.3.0\cordova-plugin-camera 
本地文件：cordova plugin add plugin.tar.gz 
指定版本 
cordova plugin add [email protected] 
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 emulate android

Windows下convert命令冲突，直接“cordova emulate android”会报Error: spawn ENOENT，需要先启动模拟器。

h.在浏览器运行

引用

> cordova serve android

浏览器访问地址：http://localhost:8000/，就可以和调试页面一样调试app的布局了。如果app中使用了cordova的Native API调用，会弹出以下对话框： 
 
这是因为浏览器无法提供@JavascriptInterface的接口，Cordova视图通过prompt()和Native交互，这样做是因为Android2.3 simulator的Bug。所以调试页面布局，无视即可。

i.通过USB直接安装到真机

引用

> cordova run android

Cordova CLI 采用 Lazy Loading的方式，当你创建Cordova工程、添加平台支持，安装插件等等的时候从服务器上下载相应的文件解压到相应的文件夹中。lazy-loaded的文件存放在系统用户的文件夹下，比如Windows XP是C:\Documents and 
Settings\RenSanNing\.cordova。所以第一次使用的时候会比较慢。

常用命令

（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为应用的入口文件。

更多：http://cordova.apache.org/docs/en/3.4.0/index.html

时间： 2024-11-07 07:52:47

Cordova 3.x 基础（1） -- 环境搭建（Windows / Android）（转）的相关文章

【Lua学习笔记之：Lua环境搭建 Windows 不用 visual studio】

Lua 环境搭建 Windows 不用 visual studio 系统环境:Win7 64bit 联系方式:[email protected] 前言: 最近需要学习Unity3d游戏中的热更新技术,选择ULua方案,因此准备学习一些Lua的基础知识.之前在Ubuntu上曾经写过Lua版本的"HelloWorld", 但那时的环境搭建只需要下载源码,然后 make & make install 就可以了,但一到Windows下就完全不会做了.经过网络查找对比,得到目前自认为较好

OpenCV基础篇——环境搭建

在开始使用opencv的时候第一步就是搭建环境,关于opencv的环境搭建其实很简单,网上也有很多,一般来说才开始学习都会搭建环境很多次,至少我是这样的.这样对问题的排除有很很大的帮助.现在就把我的搭建方式分享一下: 一.opencv+vs2010 1.opencv的获取: 最好从opencv的官网获取,也可以从opencv的官方中文论坛获取:http://wiki.opencv.org.cn/index.php/%E9%A6%96%E9%A1%B5 我使用的是opencv2.4.4版的,基本上

Python环境搭建(windows)

Python环境搭建(windows) Python简介 Python(英国发音:/?pa?θ?n/ 美国发音:/?pa?θɑ?n/),是一种面向对象.直译式计算机编程语言,具有近二十年的发展历史,成熟且稳定.它包含了一组完善而且容易理解的标准库,能够轻松完成很多常见的任务.它的语法简捷和清晰,尽量使用无异义的英语单词,与其它大多数程序设计语言使用大括号不一样,它使用缩进来定义语句块. 与Scheme.Ruby.Perl.Tcl等动态语言一样,Python具备垃圾回收功能,能够自动管理内存使用.

Android开发环境搭建(Windows)

1.JDK安装 去甲骨文官网下载JDK(点我下载),安装成功后在我的电脑->属性->高级->环境变量->系统变量中添加以下环境变量: JAVA_HOME值为C:\Program Files\Java\jdk1.7.0_45,即你的JDK根目录 CLASSPATH值为.;%JAVA_HOME%\lib\dt.jar;%JAVA_HOME%\lib\tools.jar; PATH值为;%ANT_HOME%\bin 在cmd下输入java -version命令测试是否配置成功 2.And

Centos 基础开发环境搭建之Maven私服nexus

1. 软件 a) 下载Nexus 地址:http://www.sonatype.org/downloads/nexus-2.1.2-bundle.tar.gz b) 如无特殊说明,本文档操作用户为nexus c) nexus默认的管理员用户名密码是:admin/admin123 2. 安装 a) 解压 1 $ tar zxvf nexus-2.1.2-bundle.tar.gz b) 移动到其他目录 1 $ mv nexus-2.1.2 /home/nexus/nexus c) 设置为系统自启动

Hadoop开发环境搭建 windows下Eclipse

Hadoop开发环境搭建 windows下Eclipse 下载Eclipse www.eclipse.org 解压. 下载Hadoop的Eclipse Plugin 将插件包放到eclipse的plugins目录下.重启eclipse. 下载hadoop的安装包 将下载的hadoop安装包,解压到任一目录,最好是英文且无空格目录. 配置eclipse Hadoop instllation directory:设置为hadoop安装包解压的目录. Window->open persperctive

Qt开发环境搭建 - Windows + VS2010 + VS插件

Qt 开发环境搭建 - Windows+VS2010+VS插件 1.Qt在Windows平台下的三种开发环境 方案 编辑器 编译器 调试器 一 Qt Creator MinGW GDB 二 Qt Creator VisualC++ 编译器 Debugging Tools for Windows 三 VS2010自带 VS2010自带 VS2010自带 说明: 1) C/C++语言.Qt库.开发环境.操作系统的关系 2) 编辑器.编译器.调试器三者的关系 2.1) 三者共同组成了开发环境 2.2)

Appium-001-测试开发环境搭建（Android - Win7）

随着移动端 App 测试自动化的兴起,为更好的控制产品质量,越来越多的中大型公司开始了移动端的自动化测试.Appium 自动化测试技术也是我很早之前就想学习的一门技术,却一直没有比较空余的时间来学习(也许是自己懒得缘故吧 ^_^),自今天开始我将开始自己的移动端 UI 自动化测试之旅. Appium 相关的概要说明介绍,请各位朋友联系度娘或顾大爷,在此不再赘述.俗话说,工欲善其事必先利其器,因而此文主要讲述 Appium 在 Win 7 系统下 Android  UI 测试开发环境搭建相关问题.

[Android] 环境配置之基础开发环境（SDK/Android Studio）（转）

[Android] 环境配置之基础开发环境(SDK/Android Studio) 博客: blog.csdn.net/qiujuer 网站: www.qiujuer.net 开源库: Genius-Android 转载请注明出处: http://blog.csdn.net/qiujuer/article/details/41800229 ======================================================== 恼骚 有必要说的是,其实我知道现在网络中这样

【后端技术栈1】基础开发环境搭建

谁谁说过,不积跬步无以至千里,基础的环境和工具能快速搭建和上手需要积累和练习,下面是一些常用的工具和环境搭建,希望不再各种寻找和对比各种教程,亲测可用: JDK1.8安装和验证 数据库的安装 MySQL+Navicat:MySQL 8.0.12安装教程(windows 64位)  https://blog.csdn.net/qq_37350706/article/details/81707862 Oracle:Oracle 11g数据库详细安装步骤图解,附带安装包  https://blog.c