sencha ext js 6 快速入门(必看)


Posted in Javascript onJune 01, 2016

Sencha Ext JS号称是目前世界上最先进和最强大的、支持多平台多设备的JavaScript应用程序开发框架。首先看一下Ext JS的发展简史。

1 Ext JS发展简史

1.YUI-Ext的作者Jack Slocum(杰克.斯洛克姆)打算对基于BSD协议的Yahoo User Interface (YUI)库进行自定义的扩展,但后来一度风头盖过其父辈YUI;

2.在2006年底,YUI-Ext被简化为Ext,反映了它作为一个框架的成熟和独立。该公司成立于2007年初,Ext现在为双执照,使用LGPL和一个商业执照;

3.在2007年4月1日,发布1.0正式版,现在的版本为6.0;

4.从4.0开始引入了MVC/MVVM风格的应用架构和SCSS;

5.从5.0开始,不再支持老旧浏览器,如IE5、6、7等;

6.从6.0开始,Sencha Touch和ExtJS合二为一,标志着用户可以开发既能支持传统桌面、又支持平板或手机的应用

2 开发准备

1. 首先需要下载Ext JS SDK,下载ExtJS 6.0 SDK GPL正式版  https://www.sencha.com/legal/gpl/ ,如果需要商业应用,请下载商业版。解压到D盘。

2. 下载Sencha Tool ,假设你的系统里没有安装了JRE7+,请下载带JRE版本的Sencha Tool,并成功安装。

3 项目创建

1. 用管理员打开命令行,用 cd /d d:\ext-6.0.0 进入SDK目录

2. 用 sencha -sdk ./ext-6.0.0 generate app -classic cmpwebui  ./CMPWebUI 命令创建基于ext-6.0.0版本的名为cmpwebui的app,项目路径为./CMPWebUI.

sencha ext js 6 快速入门(必看)

在目录D:\ext-6.0.0下生成CMPWebUI项目文件,文件结构如下:

sencha ext js 6 快速入门(必看)

      3. 进入项目文件下,用 sencha app watch 项目预览,端口号默认为1841,如果当前已有,则会递增,这里端口为1842

sencha ext js 6 快速入门(必看)

     在浏览器中输入http://localhost:1842/进行预览,和我一开始期望的不同,里面包含官方的例子,可以点击【view the Example】进行查看。

sencha ext js 6 快速入门(必看)

sencha ext js 6 快速入门(必看)

sencha ext js 6 快速入门(必看)

那么自己创建的项目在哪呢?可以输入http://localhost:1842/cmpwebui/ 进行查看

sencha ext js 6 快速入门(必看)

 4. 项目发布,用sencha app build进行编译

sencha ext js 6 快速入门(必看)

 

sencha ext js 6 快速入门(必看)

编译完成后,可以在ext-6.0.0下的build文件下看到此发布的项目。

 5. IIS项目发布,这里需要注意配置IIS来解析JSON,否则网站无法预览、

sencha ext js 6 快速入门(必看)

想要运行其实很简单,只要能让*.json的文件能够被Web服务器解析即可,这里以IIS7为例说明。

1)安装IIS7的ASP支持

控制面板-->程序和功能-->打开和关闭Windows功能-->角色-->添加角色服务-->应用程序开发-->选择ASP

2)给默认网站添加MIME类型

添加-->文件扩展名为json,MIME类型为text/json(或application/x-javascript也可以)

3)给默认网站安装脚本映射

处理程序映射-->添加脚本映射。请求路径为*.json,可执行文件为%windir%\system32\inetsrv\asp.dll,名称为json

4)在默认文档中添加index.html

5)在默认网站下创建SenchaTouch应用程序,IIS6下称作虚拟目录。

6)使用Chome预览(IE不支持)

至此配置完成后,可以看到文件夹下多了 一个web.config

sencha ext js 6 快速入门(必看)

再刷新网页即可:

sencha ext js 6 快速入门(必看)

以上这篇sencha ext js 6 快速入门(必看)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
提高 DHTML 页面性能
Dec 25 Javascript
编写跨浏览器的javascript代码必备[js多浏览器兼容写法]
Oct 29 Javascript
js通过googleAIP翻译PHP系统的语言配置的实现代码
Oct 17 Javascript
js将iframe中控件的值传到主页面控件中的实现方法
Mar 11 Javascript
JavaScript中用字面量创建对象介绍
Dec 31 Javascript
今天抽时间给大家整理jquery和ajax的相关知识
Nov 17 Javascript
精通JavaScript的this关键字
May 28 Javascript
jQuery实现输入框邮箱内容自动补全与上下翻动显示效果【附demo源码下载】
Sep 20 Javascript
JS常用算法实现代码
Nov 14 Javascript
Vue实现双向绑定的原理以及响应式数据的方法
Jul 02 Javascript
开发中常用的25个JavaScript单行代码(小结)
Jun 28 Javascript
如何编写一个 Webpack Loader的实现
Oct 18 Javascript
Bootstrap3.0建站教程(一)之bootstrap表单元素排版
Jun 01 #Javascript
分享一个插件实现水珠自动下落效果
Jun 01 #Javascript
js匿名函数作为函数参数详解
Jun 01 #Javascript
仅9张思维导图帮你轻松学习Javascript 就这么简单
Jun 01 #Javascript
JavaScript中匿名函数的用法及优缺点详解
Jun 01 #Javascript
Bootstrap 折叠(Collapse)插件用法实例详解
Jun 01 #Javascript
Bootstrap 附加导航(Affix)插件实例详解
Jun 01 #Javascript
You might like
PHP的单引号和双引号 字符串效率
2009/05/27 PHP
php_xmlhttp 乱码问题解决方法
2009/08/07 PHP
php和数据库结合的一个简单的web实例 代码分析 (php初学者)
2011/07/28 PHP
实现PHP多线程异步请求的3种方法
2014/01/17 PHP
php检测useragent版本示例
2014/03/24 PHP
YII中assets的使用示例
2014/07/31 PHP
8个PHP程序员常用的功能汇总
2014/12/18 PHP
CodeIgniter分页类pagination使用方法示例
2016/03/28 PHP
Javascript 日期对象Date扩展方法
2009/05/30 Javascript
JavaScrip单线程引擎工作原理分析
2010/09/04 Javascript
基于jquery的划词搜索实现(备忘)
2010/09/14 Javascript
js批量设置样式的三种方法不推荐使用with
2013/02/25 Javascript
Jquery的each里用return true或false代替break或continue
2014/05/21 Javascript
jQuery实现的手机发送验证码倒计时效果代码分享
2015/08/24 Javascript
分享自己用JS做的扫雷小游戏
2016/02/17 Javascript
微信小程序 开发指南详解
2016/09/27 Javascript
nodejs的压缩文件模块archiver用法示例
2017/01/18 NodeJs
NodeJs中express框架的send()方法简介
2017/06/20 NodeJs
vue数据传递--我有特殊的实现技巧
2018/03/20 Javascript
Vue2实时监听表单变化的示例讲解
2018/08/30 Javascript
Vue+Express实现登录状态权限验证的示例代码
2019/05/05 Javascript
JavaScript实现多张图片放大镜效果示例【不限定图片尺寸,rem单位】
2019/05/14 Javascript
VUE实现强制渲染,强制更新
2019/10/29 Javascript
typescript配置alias的详细步骤
2020/08/12 Javascript
Python获取指定字符前面的所有字符方法
2018/05/02 Python
python实现时间o(1)的最小栈的实例代码
2018/07/23 Python
Python TCPServer 多线程多客户端通信的实现
2019/12/31 Python
Merrell美国官网:美国登山运动鞋品牌
2018/02/07 全球购物
丝芙兰新加坡官网:Sephora新加坡
2018/12/04 全球购物
维也纳通行证:Vienna PASS
2019/07/18 全球购物
自1926年以来就为冰岛保持温暖:66°North
2020/11/27 全球购物
医学毕业生自我鉴定
2013/10/30 职场文书
优秀幼教自荐信
2014/02/03 职场文书
《梅兰芳学艺》教学反思
2014/02/24 职场文书
群众路线教育实践活动学习笔记内容
2014/11/06 职场文书
优秀共产党员事迹材料2016
2016/02/29 职场文书