sencha ext js 6 快速入門(必看)
Sencha Ext JS號稱是目前世界上最先進(jìn)和最強(qiáng)大的、支持多平臺多設(shè)備的JavaScript應(yīng)用程序開發(fā)框架。首先看一下Ext JS的發(fā)展簡史。
1 Ext JS發(fā)展簡史
1.YUI-Ext的作者Jack Slocum(杰克.斯洛克姆)打算對基于BSD協(xié)議的Yahoo User Interface (YUI)庫進(jìn)行自定義的擴(kuò)展,但后來一度風(fēng)頭蓋過其父輩YUI;
2.在2006年底,YUI-Ext被簡化為Ext,反映了它作為一個框架的成熟和獨(dú)立。該公司成立于2007年初,Ext現(xiàn)在為雙執(zhí)照,使用LGPL和一個商業(yè)執(zhí)照;
3.在2007年4月1日,發(fā)布1.0正式版,現(xiàn)在的版本為6.0;
4.從4.0開始引入了MVC/MVVM風(fēng)格的應(yīng)用架構(gòu)和SCSS;
5.從5.0開始,不再支持老舊瀏覽器,如IE5、6、7等;
6.從6.0開始,Sencha Touch和ExtJS合二為一,標(biāo)志著用戶可以開發(fā)既能支持傳統(tǒng)桌面、又支持平板或手機(jī)的應(yīng)用
2 開發(fā)準(zhǔn)備
1. 首先需要下載Ext JS SDK,下載ExtJS 6.0 SDK GPL正式版 https://www.sencha.com/legal/gpl/ ,如果需要商業(yè)應(yīng)用,請下載商業(yè)版。解壓到D盤。
2. 下載Sencha Tool ,假設(shè)你的系統(tǒng)里沒有安裝了JRE7+,請下載帶JRE版本的Sencha Tool,并成功安裝。
3 項(xiàng)目創(chuàng)建
1. 用管理員打開命令行,用 cd /d d:\ext-6.0.0 進(jìn)入SDK目錄
2. 用 sencha -sdk ./ext-6.0.0 generate app -classic cmpwebui ./CMPWebUI 命令創(chuàng)建基于ext-6.0.0版本的名為cmpwebui的app,項(xiàng)目路徑為./CMPWebUI.
在目錄D:\ext-6.0.0下生成CMPWebUI項(xiàng)目文件,文件結(jié)構(gòu)如下:
3. 進(jìn)入項(xiàng)目文件下,用 sencha app watch 項(xiàng)目預(yù)覽,端口號默認(rèn)為1841,如果當(dāng)前已有,則會遞增,這里端口為1842
在瀏覽器中輸入http://localhost:1842/進(jìn)行預(yù)覽,和我一開始期望的不同,里面包含官方的例子,可以點(diǎn)擊【view the Example】進(jìn)行查看。
那么自己創(chuàng)建的項(xiàng)目在哪呢?可以輸入http://localhost:1842/cmpwebui/ 進(jìn)行查看
4. 項(xiàng)目發(fā)布,用sencha app build進(jìn)行編譯
編譯完成后,可以在ext-6.0.0下的build文件下看到此發(fā)布的項(xiàng)目。
5. IIS項(xiàng)目發(fā)布,這里需要注意配置IIS來解析JSON,否則網(wǎng)站無法預(yù)覽、
想要運(yùn)行其實(shí)很簡單,只要能讓*.json的文件能夠被Web服務(wù)器解析即可,這里以IIS7為例說明。
1)安裝IIS7的ASP支持
控制面板-->程序和功能-->打開和關(guān)閉Windows功能-->角色-->添加角色服務(wù)-->應(yīng)用程序開發(fā)-->選擇ASP
2)給默認(rèn)網(wǎng)站添加MIME類型
添加-->文件擴(kuò)展名為json,MIME類型為text/json(或application/x-javascript也可以)
3)給默認(rèn)網(wǎng)站安裝腳本映射
處理程序映射-->添加腳本映射。請求路徑為*.json,可執(zhí)行文件為%windir%\system32\inetsrv\asp.dll,名稱為json
4)在默認(rèn)文檔中添加index.html
5)在默認(rèn)網(wǎng)站下創(chuàng)建SenchaTouch應(yīng)用程序,IIS6下稱作虛擬目錄。
6)使用Chome預(yù)覽(IE不支持)
至此配置完成后,可以看到文件夾下多了 一個web.config
再刷新網(wǎng)頁即可:
以上這篇sencha ext js 6 快速入門(必看)就是小編分享給大家的全部內(nèi)容了,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關(guān)文章
每天一篇javascript學(xué)習(xí)小結(jié)(Array數(shù)組)
這篇文章主要介紹了javascript中的Array數(shù)組知識點(diǎn),對數(shù)組的基本使用方法,以及各種方法進(jìn)行整理,感興趣的小伙伴們可以參考一下2015-11-11用console.table()調(diào)試javascript
昨天我了解到Chrome調(diào)試工具一個小巧的調(diào)試方法,在WDCC期間, Marcus Ross(@zahlenhelfer) 介紹了,chrome調(diào)試工具各種調(diào)試方法,這個只是其中一種,現(xiàn)在我來給大家秀下。2014-09-09Javascript四舍五入Math.round()與Math.pow()使用介紹
本文為大家介紹下Javascript中的四舍五入Math.round()與Math.pow()的使用,感興趣的朋友不要錯過2013-12-12javascript實(shí)現(xiàn)Email郵件顯示與刪除功能
這篇文章主要介紹了javascript實(shí)現(xiàn)Email郵件顯示與刪除功能,需要的朋友可以參考下2015-11-11學(xué)習(xí)RxJS之JavaScript框架Cycle.js
這篇文章主要介紹了學(xué)習(xí)RxJS之JavaScript框架Cycle.js ,它是一個極簡的JavaScript框架(核心部分加上注釋125行),提供了一種函數(shù)式,響應(yīng)式的人機(jī)交互接口,需要的朋友可以參考下2019-06-06javascript從定義到執(zhí)行 你不知道的那些事
這篇文章主要介紹了javascript從定義到執(zhí)行,你不知道的那些事,感興趣的小伙伴們可以參考一下2016-01-01Selenium執(zhí)行JavaScript腳本的方法示例
這篇文章主要介紹了Selenium執(zhí)行JavaScript腳本的方法示例,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-12-12javascript實(shí)現(xiàn)瀑布流自適應(yīng)遇到的問題及解決方案
這篇文章主要介紹了javascript實(shí)現(xiàn)瀑布流自適應(yīng)遇到的問題及解決方案,需要的朋友可以參考下2015-01-01