1. 程式人生 > >002-Sencha Cmd 6的新特性

002-Sencha Cmd 6的新特性

Cmd 6.2的新特性

Cmd 6.2包含一些新的實用工具,使您可以更輕鬆地在Ext JS應用程式中使用Cmd。
大多數這些新工具都集中在工作區定製和非Cmd應用程式和工作空間上。

讓我們來看看其中的一些新特性。

應用程式初始化

app init初始化當前目錄為Sencha Cmd應用目錄。
您可以從一個完全空的目錄開始,發出以下命令之一,最後生成一個完全結構化的Ext js/cmd“hello world”應用程式。

sencha app init --ext=/path/to/extjs/ MyApp --modern

sencha app init --ext=/path/to/extjs/ MyApp --classic

sencha app init --ext=/path/to/extjs/ MyApp --universal

注意:您的應用程式在構建之前不能使用:

sencha app build

app install

app install確保了一個不完整的Sencha Cmd應用程式在一個可執行的狀態。
例如,您可以使用一個非常簡單的應用程式資料夾,將它放到您的機器上,然後執行這個命令來建立一個完整的Cmd應用基礎架構。

您可以檢視這個github倉庫的例子(https://github.com/sencha-extjs-examples/QuickStart/),以便檢視該命令的示例:

sencha app install --frameworks=/path/to/extjs


“框架”是Cmd 6.1中引入的特性(見下文)。
它允許您指向包含多個Ext JS版本的資料夾。
正如您在上面的“程式碼倉庫”中看到的,Ext JS版本是在workspace.json中指定的。
框架標記將嘗試在您所指向的資料夾中找到與所需版本最接近的匹配。

workspace init

workspace init確保當前目錄是一個Sencha Cmd工作空間或是工作空間的一部分。

sencha workspace init

workspace install

workspace install確保了一個不完整的Sencha Cmd工作區處於可執行狀態。
例如,您可以使用一個非常簡單的工作空間資料夾,將它放到您的機器上,然後執行這個命令來建立一個完整的Cmd基礎架構。

sencha workspace install --frameworks=/path/to/extjs

工作區清理命令

workspace cleanup用於將不再出現在工作區中的應用程式入口從workspace.json中刪除 。

sencha workspace cleanup

Sencha Cmd 6.1中的新特性

框架和工作區管理

當專案擴充套件到在單個工作空間中對多個應用程式進行操作的時候,不同的框架版本可能會存在於同一個工作空間下。
在Sencha Cmd 6.1之前,工作區只能配置一個Ext JS版本(以及Sencha Touch的另一個版本),這將迫使所有應用程式同時進行升級。

從Sencha Cmd 6.1開始,“workspace.json”檔案可以配置多個框架。

“frameworks”: {

    "ext62": "ext",

    "ext602": "ext-6.0.2"

}

“frameworks”屬性下的每個條目對應於當前工作空間中的一個目錄,屬性名是在“app.json”中使用的框架的鍵值。

app.json中的“framework”屬性對映到其中一個條目:

“framework”: “ext62”

要向工作空間新增一個新的框架,可以使用“framework add”命令:

sencha framework add /path/to/ext

這個命令將根據它的版本號(例如:Ext JS 6.2.0的“ext62”或Ext JS 6.0.2的“ext602”等)來決定所提供的框架的適當鍵。

“framework add”命令還提供了一些額外的開關配置,允許您控制框架條目的所有方面。

例如:

sencha framework add -key extFiveO -source /path/to/ext-5.0.0 -path ext50

此命令會在“workspace.json”檔案的“frameworks”屬性中新增一個類似如下的入口:

“frameworks”: {
“extFiveO”: “ext50”
}

Cmd還將把重要的框架檔案從/path/to/ext-5.0.0複製到工作區中的子資料夾ext50(用-source和-path配置項來配置)。注意,框架的鍵要以“ext”或“touch”開始。

在添加了一個框架之後,您可以通過使用它的框架鍵作為“generate app”命令的配置項來生成一個應用程式。
例如,要使用我們剛剛新增的“extSixTwo”框架來生成一個應用程式,您需要像這樣呼叫generate apps命令:

sencha generate app -extFiveO AppName path/to/app

在任何時候,您都可以使用“framework list”命令在當前工作空間中列出框架,該命令將顯示與下面類似的輸出:

C:\Workspace> sencha framework list

Workspace located at: C:\Workspace

Available frameworks

  • ext602: (Commercial)

    • Framework: Ext JS
    • Version: 6.0.2
    • Source: ext
    • Used by 1 application:
      • MyApp (./MyApp)
  • ext62: (Commercial)

    • Framework: Ext JS
    • Version: 6.2.0.589
    • Source: ext62
    • Not in use by any of the applications listed on workspace.json.
  • extFiveO: (Commercial)

    • Framework: Ext JS
    • Version: 5.0.0
    • Source: ext50
    • Used by 1 application:
      • SampleApp (path/to/app)
        注意,這個命令會讓你知道這個框架是否被“workspace.json”的“apps”屬性所列出的任何應用程式所使用。

可以使用“framework remove”命令來刪除一個框架。
例如:

sencha framework remove extFiveO

只有當框架沒有被任何應用程式使用時,上面的命令才能正常進行。
如果您想刪除一個框架條目,不管它的使用情況如何,您可以使用--force開關:

sencha framework remove --force extFiveO

要使用特定的框架升級所有應用程式,您可以使用“framework upgrade”命令。
例如,要升級一個具有“ext”鍵到最新框架版本(位於/path/to/ext)的框架,您需要執行以下命令:

sencha framework upgrade ext /path/to/ext

這將升級框架檔案,併為使用它的每個應用程式觸發一個“sencha app upgrade”命令。

當然,你也可以使用“sencha app upgrade /path/to/ext”命令升級單個應用程式。
您甚至可以升級應用程式的框架到任何已經在工作空間中的框架:

sencha app upgrade ../ext62

“workspace upgrade”命令提供了一種方法,可以在您的應用程式和包中升級整個工作空間的與Cmd相關的檔案。

sencha workspace upgrade

這個命令不會更新框架版本或任何其他資訊,只升級在每個應用程式和包中使用的與Cmd相關的檔案。

Sencha Cmd 6的新特性

新的安裝程式

使用Sencha Cmd 6,我們已經更改了安裝程式,以包含執行Sencha Cmd所需的Java執行時環境(JRE)。
使用這些安裝程式意味著您不需要另外下載和安裝Java。
結合了Ruby的依賴(見下文)的移除,Sencha Cmd除了作業系統之外沒有任何先決條件(軟體依賴)。
我們仍會提供不包含JRE的安裝程式。

非管理員許可權

新的安裝程式不需要UAC許可權(對於Windows)或root特權(對於Mac和Linux)。

Ruby非依賴

隨著Fashion的引入(見下),對於Ext JS 6應用程式和主題來說,Sencha Cmd不再依賴於Ruby。
雖然這提供了許多優點(比如實時更新),但是任何依賴於Ruby程式碼的Compass功能都將不可用。
然而,Compass中的Sass程式碼包含在Fashion中,因此這不會影響到所有的Compass功能。

Compass(舊的框架)

如果您將使用Sencha Cmd 6和舊的框架(Ext JS 4和5或Sencha Touch 2),您仍然需要Ruby來編譯Sass程式碼。
安裝程式可以被要求安裝所需版本的Compass(和Sass)來支援這些框架。
預設情況下禁用此設定,但是可以在Sencha的安裝程式引導介面的Compass extension選擇介面中啟用。

Fashion

正如上面所提到的,Sencha Cmd 6包括“Fashion”模組,Sencha的新Sass派生語言編譯器。
Sencha Cmd使用Fashion來為Ext JS 6應用程式和主題構建樣式規則( .scss檔案)。
在使用sencha app watch時,你還可以使用實時更新來保持你的應用程式的CSS與SCSS同步,而無需重新載入頁面。
想了解更多關於Fashion的知識,請參閱Fashion指南。

工作空間的改進

包目錄

為了方便使用包來進行程式碼共享,Sencha Cmd 6為包引入了一個額外的資料夾。
這允許您生成的包在一個地方,而引用包(需要下載並提取)卻在另一個地方。

/ # The workspace root folder

packages/       # The former location for all packages

    local/      # New location for generated packages

    remote/     # New location for downloaded/extracted packages

包的位置現在可以在workspace.json中配置。
“/packages/remote”資料夾可以通過原始碼控制(例如在.gitignore檔案中)被配置為“忽略”。因為該資料夾中的所有包都是從包儲存庫中下載的,並且可以在需要時再重新下載。

workspace.json

使用Sencha Cmd 6,workspace.json檔案將被自動新增到工作區的根資料夾中。
這個檔案應該在原始碼控制中被跟蹤,因為它將在以後的開發工具使用中起作用。
不過,對於初學者來說,它可以讓您配置上面提到的包路徑。

Microloader

Sencha Cmd 6為微載入器提供了一個主要版本的更新。
Microloader是由Sencha Touch首先引入的應用程式載入器,隨後為Ext JS 5應用程式對應的Sencha Cmd 5中引入了此功能模組。

使用Sencha Cmd 6,最新的微載入器現在可以用於Ext JS 6應用程式,並提供對localStorage快取的支援。
這類似於Sencha Touch的微載入器中的操作,但是有一些改進。

  • 可以在app.json中禁用快取。

  • 微載入器的內容只會被微載入器刪除。

  • 只有當前版本的應用程式才能儲存在本地儲存中。