Sencha 6.2 modern环境搭建过程(Windows环境)

来源:互联网 发布:美军在二战的地位知乎 编辑:程序博客网 时间:2024/06/04 19:46
1、安装NodeJS (http://nodejs.org/download/)安装node.js是为了使用npm命令
参考配置:
D:\Program Files\nodejs\
2、安装Ruby(http://rubyinstaller.org/downloads/archives)主要用来做js以及css的压缩
3、安装ruby时要勾选将添加到path ,如果没有勾选,手动将安装根目录添加到path 中,参考:
C:\Ruby193\bin
4、安装PhoneGap(http://phonegap.com/install/)(可不装,忽略)
打开命令行,输入命令:
npm install -g phonegap
5、安装Cordova(http://cordova.apache.org/)
npm install -g cordova
5.1、cordova在6.4.0(cordova-android在6.1.2)之后,会要求安装Gradle,基于Gradle来编译、打包android
下载https://gradle.org/releases
配置环境变量
6、安装 ant(http://ant.apache.org/)
参考配置:
ANT_HOME C:\apache-ant-1.8.1
PATH ;%ANT_HOME%\bin
CLASSPATH ,;%ANT_HOME%\lib
7、安装 JDK
参考配置:
JAVA_HOME D:\Program Files\Java\jdk1.8.0_31
PATH ;%JAVA_HOME%\bin
CLASSPATH ,;%JAVA_HOME%\lib
8、安装 sencha cmd
参考配置:
D:\Program Files\Sencha\Cmd\6.2.1.29
9、验证下是否安装正确:

10、下载安装Android SDK Tools
将最新的Android SDK Tools、AndroidSDK Platform-tools、Android-SDK Build-tools以及Android API选中安装,这一步耗时主要取决于网络状况

配置环境变量:



11、安装Git (http://git-scm.com/)主要是用于cordova插件的远程下载
Path中添加配置:
D:\Program Files\Git\cmd
12、下载ADT(Android Developer Tools),
13、将ADT插件添加到Eclipse中,选择Help -> Install New SoftWare,选择ADT的压缩包


添加完成后,重启Eclipse
14、创建Ext工程(测试
1)、cd E:\ext-doc\ext-6.2.0
2)、sencha generate app TestApp E:\\TestApp_workspace (默认生成两种主题)
3)、sencha generate app TestApp modern E:\\TestApp_workspace(使用modern主题)
15、添加cordova支持
1)、cd E:\TestApp_workspace
2)、sencha cordova init com.inforstack.testapp cordova
16、修改E:\\TestApp_workspace\app.json

注:该图配置为 14->2) 命令创建的项目

注:该图配置为 14-3) 命令创建的项目配置,默认是native,改为了android和添加了ios支持,ios需要在mac环境打包
17、添加cordova插件(可选),可在 http://cordova.apache.org/docs/en/6.x/#plugin-apis 官网中查找需要的插件,以添加一个启动画面插件支持为例,
1)、cd E:\\TestApp_workspace\cordova
2)、cordova plugin add cordova-plugin-splashscreen

插件对应的api可查看该插件对应目录下的README.md文件
18、打包 (第一次打包会很慢,具体时间视网络情况而定)
打包命令: sencha app build android


19、APK应用的名字:

导入工程到eclipse

选择android项目以及一个依赖包

看MainActivity的配置


20、导出安装包


选择证书,或者创建一个新的证书




原创粉丝点击