ExtJS5 （一） 超簡單整合到eclipse中，搭建簡單的開發環境

我的一直欣賞大神們的惟美前端頁面，而如今我的從事的是MIS系統等相關的開發，故決定學習ExtJS，目前最新版本是5.0，就從5.0開始吧。

 

做爲java開發人員，天然而然的想在eclipse中搞個extjs的簡單開發環境，之後再慢慢豐富，開始吧~

第一步：從官網下載extjs，目前是5.0版本

第二步：用eclipse建立一個動態web工程

第三步：在工程的WebContent目錄下建立一個文件夾，叫做ExtJS5。

第四步：解壓從官網下載的extjs，解壓以後，目錄結構以下：

看一下根目錄下的index，瞭解了使用extjs時，依賴的一些文件的位置，通常須要根目錄下的ext-all.js和build文件夾中的一些css和package文件夾。

將依賴的extjs文件複製到工程中新建的extjs5文件夾下便可，工程結構以下：

通過上面四步，好啦，能夠編寫html文件了，在WebContent目錄下，建立一個經典的index.html文件，並引用extjs相關的文件，代碼以下：

在head標籤內，分別引用了ext提供的某個主題的css文件和ext提供的主題js及框架js文件

 

引用完ext相關的文件以後，就要以ext的規範建立一個小窗口了，我將這個建立小窗口的代碼放置在了WebContent目錄下的本身創建的AppJS目錄下，

代碼是參數ext的示例編寫的，以下所示：

說實話，目前還不清楚這段代碼的詳細規格，但經過名稱可以猜想出其大概的意思。

 

好了，此時，算是準備工做完工了，發佈到經典的tomcat下，訪問經典的http://localhost:8080/工程名稱，便可看到效果了：

 

完工。

（對了，引用extjs的相關文件以後，eclipse默認會去對這些文件進行驗證，形成eclpise超卡，

解決辦法就是刪除掉工程目錄下的工程文件.project內的有關js驗證的相關配置便可）

 

/********************************************外星人喬丹拍板時間***************************************/

我喜歡一切美好的東西