从sencha touch迁移至extjs6开发的注意事项
2015-09-10 11:42
549 查看
当前使用的extjs版本为6.0.0,sencha cmd 的版本为6.0.1.76。
sencha touch被合并到extjs6里面,extjs6可以开发桌面端、移动端、甚至通用的web app(针对不同设备类型自动显示不同的页面),相同的代码可以共用,比如桌面端和移动端假如只是界面不同,像model和controller那些如果相同的话可以共用,即便是有些区别也可以写个父类,然后移动端和桌面端的代码分别继承该类并添加额外功能。
另外,extjs6也支持MVVM了,利用官方文档的最佳实践MVVM+MVC混合来开发,真的令人很愉悦。
当然我们只是开发移动端的,下面介绍下怎样做。extjs6引入了toolkit概念,做移动端的toolkit是modern,桌面端的是classic,我们将用它的modern toolkit来开发。
创建一个app:sencha –sdk (sdk目录) generate app –modern (app名称) (生成的目录)
例如:sencha –sdk G:\lib\JavaScript\extjs\ext-6.0.0-gpl\ext-6.0.0 generateapp –modern Test my-test
如果不加“-modern”的话它会自动生成一个通用app,有app、classic和modern三个目录存放源代码,app为共用代码目录,classic和modern分别为桌面端和移动端的不共用代码。但我们只是做移动端的,所以存放源码的就一个app目录。
应用目录结构大致是这样:
ext为extjs6的sdk目录
sass为存放本应用的scss样式文件的目录
resources为存放资源的目录
packages存放包,里面可以放主题或代码,在app.json里面可以require进来,比如我们以前继承了主题“theme-cupertino”,自定义了一个苹果主题,现在又拷到packages里面,然后我们只需要在app.json里面require一下,并且将theme改为我们自定义的主题的名称,就可以直接利用以前做好的主题继续开发。
也可以利用sencha cmd来generate一个workspace,这样packages就可以直接在多个应用共用,不需要复制。
移动端的主题在ext/modern/目录下:
该目录下还有一个名为modern的目录,那是JavaScript源代码,下面的是主题的源代码, theme-cupertino(苹果)、theme-mountainview(安卓)、theme-windows(windows phone)这几个主题都是继承于 theme-device-base,是现成的智能设备风格的主题
其实也可以直接用sencha的jetbrains的插件,可在webstorm和IntelliJ IDEA上用,那样很多时候就不需要sencha cmd了,直接可视化操作(创建app、workspace、各种类),只不过有30天试用期限(可以在过期之前将系统时间调回以前,就不会过期了)
sencha touch被合并到extjs6里面,extjs6可以开发桌面端、移动端、甚至通用的web app(针对不同设备类型自动显示不同的页面),相同的代码可以共用,比如桌面端和移动端假如只是界面不同,像model和controller那些如果相同的话可以共用,即便是有些区别也可以写个父类,然后移动端和桌面端的代码分别继承该类并添加额外功能。
另外,extjs6也支持MVVM了,利用官方文档的最佳实践MVVM+MVC混合来开发,真的令人很愉悦。
当然我们只是开发移动端的,下面介绍下怎样做。extjs6引入了toolkit概念,做移动端的toolkit是modern,桌面端的是classic,我们将用它的modern toolkit来开发。
创建一个app:sencha –sdk (sdk目录) generate app –modern (app名称) (生成的目录)
例如:sencha –sdk G:\lib\JavaScript\extjs\ext-6.0.0-gpl\ext-6.0.0 generateapp –modern Test my-test
如果不加“-modern”的话它会自动生成一个通用app,有app、classic和modern三个目录存放源代码,app为共用代码目录,classic和modern分别为桌面端和移动端的不共用代码。但我们只是做移动端的,所以存放源码的就一个app目录。
应用目录结构大致是这样:
ext为extjs6的sdk目录
sass为存放本应用的scss样式文件的目录
resources为存放资源的目录
packages存放包,里面可以放主题或代码,在app.json里面可以require进来,比如我们以前继承了主题“theme-cupertino”,自定义了一个苹果主题,现在又拷到packages里面,然后我们只需要在app.json里面require一下,并且将theme改为我们自定义的主题的名称,就可以直接利用以前做好的主题继续开发。
也可以利用sencha cmd来generate一个workspace,这样packages就可以直接在多个应用共用,不需要复制。
移动端的主题在ext/modern/目录下:
该目录下还有一个名为modern的目录,那是JavaScript源代码,下面的是主题的源代码, theme-cupertino(苹果)、theme-mountainview(安卓)、theme-windows(windows phone)这几个主题都是继承于 theme-device-base,是现成的智能设备风格的主题
其实也可以直接用sencha的jetbrains的插件,可在webstorm和IntelliJ IDEA上用,那样很多时候就不需要sencha cmd了,直接可视化操作(创建app、workspace、各种类),只不过有30天试用期限(可以在过期之前将系统时间调回以前,就不会过期了)
相关文章推荐
- JavaScript中的_proto_与prototype的关系
- JavaScript两种方法来定义一个函数
- RGB16进制与10进制的转换
- ExtJS4教程——2、Ext.onReady、Ext.define、Ext.create基础方法
- js分秒必争
- JS数据类型之RegExp类型
- JavaScript 点击事件小节
- Javascript跨浏览器事件处理
- document.getElementById为空或不是对象的解决方法
- 原生JS实现仿淘宝网左侧商品分类菜单效果代码
- javaScript的运行机制?
- javascript的trim()函数的实现
- JavaScript版几种常见排序算法
- Javascript 的 Attribute 方法
- JS日期比较大小 给定时间和持续时间计算最终时间
- 如何避免javascript中的冲突
- 四级联动菜单
- JS中replace()用法举例
- 两个select 多选取值的问题
- Angular.js初体验