用Sencha Cmd搭建sencha Touch2.x环境创建项目

一、安装支持sencha touch浏览器一般推荐使用的是chrome或safari浏览器，它们的内核都是webkit，之前sencha Touch是针对webkit设计的，貌似现在得Sencha Touch(目前最新版2.4.2)也支持IE10以上，以及火狐浏览器。笔者在这里使用的是火狐浏览器42.0。

二、下载Sencha Touch登录Sencha Touch官网，点击菜单栏上的”Products“菜单，在下拉框中选择“Frameworks”-->“Sencha Touch”，如下图所示。

进入到提供填写”基本信息“页面，主要是填好邮件地址，其他的看情况填写，填好邮件地址，点击“DOWNLOAD TOUCH”按钮，官网会将下载连接发到你刚才填写的邮件中，所以一定要确保邮件是正确的。

点击“DOWNLOAD NOW”按钮，过一会会弹出一个窗口，选择将文件保存下来，如下图所示。

三、搭建JDK环境因为后面的Sencha Cmd是用Java写的，还有要打包成Android的apk也需要Java的环境，所以在这里要单间好JDK的环境，搭建好好后在命令行中输入javac，如果出现一大堆有关java的提示信息则表示JDK已安装好，并且环境变量以及配置好，下图就是配置好的显示效果。（具体搭建过程可以参考下面的引用教程）

四、搭建Ruby环境Ruby主要是用来对js和css进行压缩的，在使用Senca Cmd 生成测试包后部署包时调用的命令会用到Ruby。安装好Ruby后在Windows的“命令提示符界面”中输入ruby -v，如果显示版本号等信息，则表示安装完成。（具体搭建过程可以参考下面的引用教程）

五、搭建Android开发环境搭建Android开发环境是为了使应用最后打包生成apk应用，在这里需要下载Android SDK并配置好环境变量。（具体搭建过程可以参考下面的引用教程）

六、安装Sencha Cmdsencha cmd 是一款功能强大的命令行工具，使用它你可以自由地创建Sencha Touch的app项目，以及将项目打包成相应移动平台的安装程序。所以必须要安装Sencha Cmd，基本上下载下来是傻瓜式安装（具体安装过程可以参考下面的引用教程），安装完成后需要配置环境变量，将安装路径配置到系统的Path中，如下图所示。

测试Sencha Cmd是否配置好环境变量，在命令行中输入sencha命令，如果出现cmd的版本及相关信息，怎么表明配置好了，如果没有，请进行上一步环境变量的配置。

七、创建项目将刚才下载的Sencha Touch安装包解压，这里我解压在D盘，然后打开“命令提示符”窗口，进入到相应目录输入创建项目的命令sencha -sdk /path/to/sdk generate app MyApp /path/to/myapp （其中-sdk /path/to/sdk是指向你解压后的安装包的目录，MyApp是应用的名字，/path/to/myapp在磁盘上生成项目文件夹的名字）。在这里，我们已经进入安装包目录，在D盘根目录生成项目文件夹，所以在这里我输入命令sencha generate app MyApp  /myapp如果输入命令后一直没有报错，一直是绿色的如下图，代表项目创建成功。

创建好后可以看到，可以看到在D盘生成了一个项目myapp，项目的目录如下图所示。

直接将目录下的index.html文件用火狐浏览器打开，可以看到Sencha Touch2的欢迎界面，如下图所示。

将项目设置成虚拟目录到Tomcat服务器或直接将项目移动到Tomcat的webapps根目录下，在浏览器中输入localhost/myapp访问，如下图所示。

如果你使用的是火狐浏览器15-17步可以省略不看，如果你使用谷歌浏览器建议观看。注意如果，你用谷歌浏览器测试，会遇到跨域问题，也就是直接打开index.html出现如下图情况，一种解决方法：将项目放到服务器中，然后再访问。

另一种解决方法：右击桌面的谷歌快捷方式图标，点击“属性”，然后在谷歌属性面板中的“快捷方式”一栏的目标（T）后面，加上“--disable-web-security”命令。注意：“--disable-web-security”命令之前要空一格。

然后打开浏览器会看到谷歌浏览器提示“您使用的是不受支持的命令行标记：--disable-web-security。稳定性和安全性会有所下降。”的提示，证明设置成功，然后就可以不将项目放到服务器下，通过设置的”谷歌快捷方式图标“就可以访问了（直接将那个项目中的index.html拖入此谷歌快捷方式）。

八、程序编译和打包Sencha Cmd的编译打包实际上就是对应用的压缩。Sencha Cmd为我们提供了4种不同的编译和打包方式，分别是sencha app build testing 供测试，QA使用版本sencha app build package 脱离web server，本地html文件资源包sencha app build production 正式发布的webapp产品sencha app build native 打包成移动应用如android的apk或ios的app首先，我们进入到项目目录输入sencha app build testing命令编译打包，如下图所示。

使用testing方式编译打包后，我们可以看到项目的目录下的build文件夹中会有一个testing文件，它下面生成了一个应用名称的文件夹，在这里为MyApp，如下图所示这是它的目录。

进入到项目目录输入sencha app build package命令编译打包，如下图所示。

进入到项目目录下的build-->package-->MyApp，可以看到打包后的应用如下。

进入到项目目录输入sencha app build production命令编译打包，如下图所示。

进入到项目目录下的build-->production-->MyApp，可以看到打包后的应用如下。

进入到项目目录输入sencha app build native命令编译打包，如下图所示。

进入到项目目录下的build-->native-->MyApp，可以看到打包后的应用如下。