Phonegap3x环境的搭建与配置.docx
《Phonegap3x环境的搭建与配置.docx》由会员分享，可在线阅读，更多相关《Phonegap3x环境的搭建与配置.docx（14页珍藏版）》请在冰豆网上搜索。
Phonegap3x环境的搭建与配置
Phonegap3.x环境的搭建与配置
1:
node.js
先去https:
//nodejs.org/下载node并安装
2：
下载java的JDK并配置环境变量
新建用户变量（JAVA_HOME）如图：
未了在命令行中方便使用JDK命令，可以将JDK的bin路径添加到PATH系统变量中
在（是用户变量中的PATH）PATH变量中添加：
;%JAVA_HOME%\bin\如下图：
加完之后可以验证一下：
在控制台中输入javac,如果能识别出来这个命令就配置正确了。
CLASSPATH变量（也是用户变量里）
C:
\ProgramFiles\Java\jdk1.8.0_40\lib\dt.jar;C:
\ProgramFiles\Java\jdk1.8.0_40\lib\tools.jar
4:
安装ANT
PhoneGap需要ApacheAnt来编译工程.
上网站http:
//ant.apache.org/bindownload.cgi下载Ant.
下载后解压到C:
\apache-ant-1.9.4。
配置Ant环境变量:
在用户变量中新建ANT__HOME
未了在命令行中方便使用Ant命令，可以将Ant的bin路径添加到PATH变量中,
;%ANT_HOME%\bin
配置Android环境（在网上没看到需要配置Android环境，只是书上需要）
AndroidSDK在硬盘里有，目前是最新最全的30多个G。
解压到硬盘上后该一个工作空间就可以了。
新建ANDROID_HOME环境变量：
C:
\adt-bundle-windows-x86_64-20140702\sdk
然后将Android工具目录和平台工具目录添加到PATH环境变量中，
;%ANDROID_HOME%\tools;%ANDROID_HOME%\platform-tools
下载最新的ADT网址为：
安装Phonegap:
打开Nodecommandprompt:
输入：
npminstall–gphonegap
等一会安装完成。
在安装cordova
npminstall–gcordova
安装完成后可以用:
phonegap–version
cordova–version
来验证是否安装成功。
创建cordova工程。
（网上都用phonegat来创建，可以是以前的版本，现在用cordova）
打开命令提示符窗口：
进入c:
\
Cordovacreatehellocom.zhumac.hellohelloapp
等一会，会在c盘下面生成hello文件夹.
cdhello进入hello文件夹。
Cordovaplatformaddandroid或cordovaplatformaddios
等一会后会在platforms文件夹中生成一个android文件夹或ios文件夹
生成ios时最好在苹果pc内
用命令行的方式来部署Cordova：
（下面是网上的方法）
1.安装nodejs
下载：
http:
//nodejs.org/download/.安装完毕后需要重启。
2.安装cordova
打开cmd命令行，执行：
npminstall-gcordova
安装约10分钟。
3.安装ant
下载ant包，解压到一个文件夹，如：
D:
\programfiles\apache-ant-1.9.4
配置该路径到环境变量中，此时若androidsdk未配置环境变量的，一并配置。
以防后面报错。
4.创建一个cordova工程
cordovacreatehellocom.shj.helloworldhelloapp
其中，第一个hello是文件夹的名称；om.shj.helloworld是appid，第二个helloapp是工程的名称，也是应用的名称。
提示下载库，请等待。
下载完成。
5.进入工程文件夹
cdhello
6.添加平台支持
有多种平台可选.命令如下：
$cordovaplatformaddios
$cordovaplatformaddamazon-fireos
$cordovaplatformaddandroid
$cordovaplatformaddblackberry10
$cordovaplatformaddfirefoxos
$cordovaplatformaddwp7
$cordovaplatformaddwp8
$cordovaplatformaddwindows8
此处选择cordovaplatformaddandroid
在工程文件夹下输入该命令：
项目创建完毕。
7.添加插件支持
主要为系统硬件访问的插件，常见如照相机、媒体访问、设备访问、加速设备、定位设备等。
可以动态的按需求去添加，譬如按以下方式添加,，更多插件请去cordova官网查看。
基本设备资讯（设备API）：
$cordovapluginaddorg.apache.cordova.device
网路连接和电池事件：
$cordovapluginaddwork-information
$cordovapluginaddorg.apache.cordova.battery-status
相机、媒体重播和捕获：
$cordovapluginaddorg.apache.cordova.camera
$cordovapluginaddorg.apache.cordova.media-capture
$cordovapluginaddorg.apache.cordova.media
访问设备或网路（档API）上的档：
$cordovapluginaddorg.apache.cordova.file
$cordovapluginaddorg.apache.cordova.file-transfer
8.构建应用
cordovabuild
若上图出现此命令需更新ant版本
上图出现该提示，BUILD成功。
即将hello/www下的内容，构建到添加的各平台内。
如android平台，会构建到此目录：
hello\platforms\android\assets\www。
9.测试应用
A）在模拟器上安装测试应用
如android平台，应先将android模拟器启动并打开。
cordovaemulateandroid
B）使用真机测试（推荐）
可使用如下命令：
cordovarunandroid
C）在浏览器中运行
cordovaserveandroid
D）使用RippleEmulator调试
npminstall-gripple-emulator
rippleemulate
打包为发布的应用
打包android应用：
借助eclipse来完成。
打开安装配置好adt插件的eclipse，使用向导导入一个android项目的方式，选择当前工程文件夹，此时会显示导入两个项目，导入即可。
项目成功导进来了。
接下来就可以把网页直接放到项目里面了。
先看PC直接打开网页的效果。
这是未修改配置的启动界面。
也就是刚刚PC端打开的网页。
网页就存在android项目asset目录下面。
引用路径如上图所示file:
///android_asset/www/index.html
通过360手机助手查看手机界面，可以看到刚刚的界面已经成功引导进去了。
在此Cordova的环境部署已经大功告成了。
Web开发人员可以很轻易的开发移动应用了。
更多详细的插件请查看官网，在此不一一细说了。
super.splashscreen=R.drawable.splash;
super.splashscreenTime=5000;
升级会员 