1. 程式人生 > >雪廬小酒學ExtJS(一):ExtJS 6.2 項目搭建

雪廬小酒學ExtJS(一):ExtJS 6.2 項目搭建

class 使用 文件 ext 提示信息 進入 兩個 電腦 必須

一、 安裝:

(創建的前提是必須是電腦的環境中有java和tomcat才行,在ExtJS6.2就不需要再裝ruby)

下載兩個壓縮包:分別是

ext-6.2.0-gpl(這個是Extjs 的sdk文件,創建新項目的時候需要用)。

SenchaCmd-6.5.2-windows-64bit (這個下載下來是解壓,或者不解壓。反正最後看到的是一個.exe 結尾的安裝文件 ,直接安裝運行即可PS:一定要記住安裝到哪個文件夾下面了)

二、 運行:

安裝好SenchaCmd-6.5.2-windows-64bit.exe 之後,點擊Windows的命令提示窗

技術分享圖片

進入到提示窗中:

使用cd 命令進入剛才 SenchaCmd-6.5.2-windows-64bit.exe 安裝的那個文件夾中,我的路徑是:C:\Users\win7\bin\Sencha\Cmd

效果如下:

技術分享圖片

命令行提示符如下:

技術分享圖片

在此駛入sencha help 可以查看命令相關的提示信息(有點與javac 之後出現的那些東西類似)。

三、 創建第一個項目:

創建項目首先得找到ext-6.2.0-gpl 的解壓路徑如下圖所示

技術分享圖片

然後在剛才打開的那個命令行中,切記一定是在C:\Users\win7\bin\Sencha\Cmd 也就是說在SenchaCmd-6.5.2-windows-64bit.exe 的安裝路徑下運行如下語句,創建第一個demo項目。

創建語句如下:

sencha -sdk [解壓後的ext-6.2.0的位置] generate app [項目名稱] [項目地址]

技術分享圖片

第一個紅圈是剛才解壓的ext-6.2.0-gpl 文件路徑 ,第二個紅圈是你要生成的demo的路徑

技術分享圖片

但是很顯然,我這個生成的太亂了所以我決定在此創建一下,這回我單獨在創建一個項目文件夾來保存生成的這些文件。

技術分享圖片

再次創建的情況如上。當出現如下畫面的時候,就表示已經完成了demo的創建。

技術分享圖片

那麽新創建的demo目錄則如下圖所示:

技術分享圖片

四、 運行demo:

此時進入新建好的項目文件夾中運行 sencha app watch 即可運行。但是此時會出現如下問題(我所遇到的)

技術分享圖片

這很明顯是因為cmd的命令沒有添加到path環境變量中,導致sencha 命令無法再全局使用(一般情況下,會在安裝cmd

的時候直接把命令添加到path中,但是不知道為什麽我的不行,所以需要手動添加)。所以需要把之前的cmd的安裝路徑添加到path中,如何添加我就不說了,安裝過java的都應該知道怎麽添加。

C:\Users\win7\bin\Sencha\Cmd------》此路徑添加到path環境變量中。即可在生成的demo文件夾下運行sencha app watch 如下圖所示

技術分享圖片

打開瀏覽器輸入:localhost:1841(如果1841端口號占用,會自動變成其他的端口號,留意裏面的提示就好),即可查看默認生成的項目

此時,一個完整的demo就展現在眼前了。

技術分享圖片

雪廬小酒學ExtJS(一):ExtJS 6.2 項目搭建