用phonegap打包html5程序(手机app开发html5 juqery moblie phonegap系列二)

时间:2021-08-31 20:02:17

1、准备安装最新版本的phonegap程序

 1.1  首先准备node.js  ,官网地址  直接点击install 就开始下载安装包,下载后默认安装就行了。

    用phonegap打包html5程序(手机app开发html5 juqery moblie phonegap系列二)


1.2  安装 ANT 打包工具,搜索下载一个最新版本的就行了,直接安装或者解压版本的都行,后面会配置环境变量。


1.3 安装phonegap的最新版本。这里要注意,最新的版本没有直接下载的地方,运行window的cmd命令,进入命令行模式后输入

C:\> npm install -g phonegap
就开始从网上开始下载并且安装,前提是 node.js 和ANT的环境变量要配置好,不然安装不上去。


1.4 理论上来说完成上面三步就可以创建和打包html5的安卓程序了,但是最好还是安装eclipse ADT 安卓的集成开发环境,这样更方便一些。

  大家搜索 Android_SDK_windows 百度一下就行了,下个最新版本的。我的版本是  adt-bundle-windows-x86-20131030,集成的是安卓4.4。

1.5 下载和安装jdk ,1.6或者1.7,1.8 的都可以。


1.6 配置环境变量 。推荐一个管理环境变量的软件 RapidEE ,大家自己搜一个,还是中文版本的。

      nodejs  和  ANT 配置在Path 里面 .

     D:\Program Files\nodejs\,

      F:\Download\apache-ant-1.9.4\bin

      jdk  配置在JAVA_HOME 里面     

    用phonegap打包html5程序(手机app开发html5 juqery moblie phonegap系列二)

1.7 利用phonegap创建 安卓下面的html5工程。

这个官网上面有说明:

$ phonegap create my-app
$ cd my-app
$ phonegap run android
  首先 window   运行 cmd 进入命令行模式。

    进入 d:  根目录 ,目录可以自己定。

   敲入上面的命令,就自动在d盘下面创建了my-app的目录,

用phonegap打包html5程序(手机app开发html5 juqery moblie phonegap系列二)

run 命令的意思就是编译和执行my-app程序,程序会自动打包,运行就不管了,下面会导入到工程到 eclipse ADT里面,我们在这个里面运行程序。

但是一定要在这里run 一下。


1.8  利用 eclipse ADT 导入编译好的phonegap工程。

用phonegap打包html5程序(手机app开发html5 juqery moblie phonegap系列二)

用phonegap打包html5程序(手机app开发html5 juqery moblie phonegap系列二)

记住不要勾选 copy  projects into workspace  这个选项。


好了 大家可以看见 导入的是 HelloWord 和HelloWorld-CordovaLib 两个工程,后面是做为lib的存在,不用管它,前面的helloWord就是你的主战场。


现在可以插入一个安卓的手机,相信大家都有了吧,记住要打开调试模式,然后在eclipse ADT里面运行 HelloWorld 工程。


用phonegap打包html5程序(手机app开发html5 juqery moblie phonegap系列二)


手机上面出来这个logo  恭喜你,第一个html5的安卓程序运行成功了。


下一章我们介绍 phonegap工程的目录结构,并把第一天的程序加入进去打包执行。