Phonegap android web 环境配置打包 和sencha mobile web 的发布

1.java sdk 

当你本地已安装过java SDK时，可以cmd后java -version查看版本.建议使用1.6或以上版本。

如本地已存在java文件但是cmd查询不到版本或提示not found时，可将当前java JDK在环境变量中重新配置即可。

32位下载路径：http://download.oracle.com/otn-pub/java/jdk/7u45-b18/jdk-7u45-windows-i586.exe

64位下载路径：http://download.oracle.com/otn-pub/java/jdk/7u45-b18/jdk-7u45-windows-x64.exe

2.phonegap

 

android sdk

下载路径①：http://developer.android.com/sdk/index.html#download

下载路径②：http://www.kuaipan.cn/file/id_61000694655619948.htm?source=1

（ps:2为我目前使用的安装文件，路径1虽然是官网下载，但是一些文件没找到。但是还是把路径公布一下）

下载完成后，解压至你指定的问的文件路径。将sdk文件夹下的platform-tools文件夹和tools文件添加到系统环境变量中。

然后cmd 输入android打开android SDK或双击当前文件夹下的android sdk manager

安装android 配置文件时，因为个人需要，我安装的是android4.2.2、android4.4、Tools文件夹全部、Extras文件夹全部

node.js

下载路径：http://nodejs.org/dist/v0.10.22/node-v0.10.22-x86.msi

安装完成之后，可在cmd node -v查看版本信息，如查不到时，则安装失败。

通过node.js安装phonegap

cmd 命令后输入：npm install -g phonegap

ant

下载路径：http://mirror.bit.edu.cn/apache//ant/binaries/apache-ant-1.9.2-bin.zip

下载完成后解压至任意位置，建议存放在很少移动的地方。

之后将解压后的文件bin的路径添加至环境变量。也可先将bin的上级目录路径新建一个环境变量：ANT_HOME之后。在环境变量中写明：%ANT_HOME%\bin。

（PS：区别是全局的和分全局，随自己定义）

配置完成之后，cmd 输入：ant 如出现找不到build.xml 错误时，则配置完成了。

配置完成之后，输入以下命令：

phonegap create test com.code.demo demo

--(PS:test为项目文件夹名称，com.code.demo为项目规范路径，demo为生成的APK名称)

phonegap run android

--(PS:期待结果结果吧，如果你一切没问题的话，并且android手机链接这你的电脑，则会自动在你的手机中安装例子项目，如果没有连接，则会启动android虚拟机，安装该项目网站。)

phonegap build android

--(PS:当你的项目文件数据或页面（也就是第一个命令的www文件夹下文件信息）改动时，可通过本命令重新编译你的文件信息)

adb install -r demo-debug.apk

--(PS:输入命令前，请先cd 进入到你的项目文件platforms\android\bin目录下才行。让你重新编译好的文件推送至手机或虚拟机。如果adb命令找不到，那恭喜你，你android JDK装错误了如下图)

 

上面已经写好了把项目打包为apk的方法

下面我们来看看怎么通过sencha快速发布网站

 

详细的步骤信息可在http://docs.sencha.com/touch/2.2.1/#!/guide/getting_started看到

首先

配置必须的文件，在文档中找到：

Required Software

然后依次安装文件即可，

一：sencha cmd

下载路径①：http://cdn.sencha.com/cmd/4.0.1.45/SenchaCmd-4.0.1.45-windows.exe.zip

下载路径②：http://www.kuaipan.cn/file/id_61000694655619965.htm?source=1

下载完成后解压安装即可。

二：说明需要配置javaJDK环境，在上面的phonegap中已经说明了详细的步骤。这里就不说了

三：ruby

下载路径①：http://dl.bintray.com/oneclick/rubyinstaller/rubyinstaller-2.0.0-p247.exe?direct

下载路径②：http://www.kuaipan.cn/file/id_61000694655619966.htm?source=1

下载完成后解压安装即可

ps:如果你是参考官方文档的安装步骤，那就注意了：ruby还分为各种版本，请斟酌后再选择

四：这个时候你已经可以单独快速的发布一个网站了

因为是测试，你可以在桌面建立一个文件夹之后里面再建立一个html文件。内容书写：Hello Word.

然后打开cmd命令进入你新建立的文件夹后输入命令：sencha web start 启动发布当前的html文件如下图：

 

红色框住的为发布的网站的端口，如：1841.也可在发布时自定义端口:

sencha fs web [-port 8000] start -map <dir_name>

文档地址为：http://docs.sencha.com/touch/2.2.1/#!/guide/command

更多详细的命令可在docs中自行查找

五：通过sencha touch 快速搭建一个手机web框架

完成以上的环境安装之后你还需要一sencha touch才能快速搭建一个mobile web 框架

下载这个sencha touch 也是一个很蛋疼的事情，官网没有直接的下载地址，需要你填写邮箱地址之后才将下载地址发给你

下载地址①：http://www.sencha.com/products/touch/download/ (:建议去掉keep me up to….的勾选框，然后你又会接到一堆新闻邮件了)

下载地址②：http://www.kuaipan.cn/file/id_61000694655619967.htm?source=1

下载完成之后，解压至一个文件路径没有空格，没有中文汉字的路径中，如：。

打开cmd命令窗口，进入sencha touch 的解压缩目录，如：d:\SDK\touch-2.3.1  。

sencha generate app demo 项目存储路径。如下图：

 

之后就看着安装吧，成功之后。使用 方法四描述的：sencha web start 启动那个网站即可，同一个内网中，手机或pc浏览器都可浏览：默认框架如下图：