介绍
Apache Cordova
是Adobe PhoneGap
被捐给apache之后改名的项目,当然phonegap依然保留。关于二者的区别,按照我的理解,phonegap一般是用来打包用的,而cordova是一个底层开发框架,但是一般情况下二者指的是同一个东西。
本文所使用的cordova版本是最新版的6.2.0。
官网地址:http://cordova.apache.org/
环境搭建
由于本人只会android,所以本文全部以安卓平台为例。
首先,你需要以下环境:
- jdk
- Android sdk
- node.js+npm
安装
cordova使用npm安装,国内速度太慢,一般推荐使用 淘宝npm 来安装。
npm install -g cordova
安装时间可能会比较久。
创建项目
cd 你的代码存放目录
cordova create mycordova com.lutongnet.mycordova 我的测试
执行完上面的命令后会按照默认的模板生成一个项目结构,生成的目录结构如下:
添加平台
cd mycordova(定位到你刚刚生成的项目目录下)
cordova platform add browser
cordova platform add android
cordova platform add ios
其中,browser
平台指的是浏览器平台,一般拿来测试用的。这个添加的过程中一般还需要联网下载一些东西。
查看已经安装的平台:
cordova platform ls
一般不建议直接修改platform下的文件,因为在构建项目或者重新安装插件后文件可能会被覆盖,如果你喜欢导入Eclipse或者Android studio自己自由开发,建议在插件全部安装好后,复制并导入到Eclipse中去。
生成的Android项目结构如下:
构建
cordova build android //只构建安卓平台
cordova build //构建所有平台
关于build这一步到底是干嘛还没仔细看,好像是将www文件夹下的前端文件复制到各个平台的指定目录下去。
运行
cordova run browser // 会用浏览器打开 http://localhost:8000/index.html
Android平台:
cordova run android
这个我一直没有运行成功,貌似需要下载很多东西,可能我这边是由于网络原因造成的,个人也不是很推荐这种方式,都已经有代码了,直接把项目导入IDE自己运行就行了,不需要非得依赖cordova。
添加插件
添加插件前建议先把需要的平台都添加好,因为添加插件的时候只会下载你已经添加过的平台,没有添加的平台对应的插件是不会下载的。
不知为何,以下命令貌似无法放到bat文件里面批量执行
cordova plugin add cordova-plugin-network-information
cordova plugin add cordova-plugin-battery-status
cordova plugin add cordova-plugin-device-motion
cordova plugin add cordova-plugin-device-orientation
cordova plugin add cordova-plugin-geolocation
cordova plugin add cordova-plugin-camera
cordova plugin add cordova-plugin-media-capture
cordova plugin add cordova-plugin-media
cordova plugin add cordova-plugin-file
cordova plugin add cordova-plugin-file-transfer
cordova plugin add cordova-plugin-dialogs
cordova plugin add cordova-plugin-vibration
cordova plugin add cordova-plugin-contacts
cordova plugin add cordova-plugin-globalization
cordova plugin add cordova-plugin-splashscreen
cordova plugin add cordova-plugin-inappbrowser
cordova plugin add cordova-plugin-console
添加完毕之后放在plugins文件夹下面:
而对应的平台下的src源码里面也自动添加了相关代码,无需自己额外手动添加:
查找插件
可以上cordova官网插件专区搜索相关插件:http://cordova.apache.org/plugins/ ,速度有点慢,进去之后要等一会才会有结果,除了前面一些是官网提供的之外,后面都是网友提供的。
导入Eclipse
直接采用Eclipse的导入功能->Exiting Android Code Into Workspace,选择..\mycordova\platforms\android
目录,然后:
如果报错了,手动修正一下sdk版本以及引入的Liberay路径,然后应该就没问题了,MainActivity是入口类:
配置首页地址:
修改/res/xml/config.xml
的<content src="index.html" />
即可,默认的这个index.html对应的是/assets/www/index.html
插上手机,直接运行,不出问题的话,Cordova的HelloWorld基本上就出来了。
参考链接
几个不错的资源: