本文地址：?[http://blog.csdn.net/sushengmiyan/article/details/38313537](http://blog.csdn.net/sushengmiyan/article/details/38313537) 本文作者：sushengmiyan -------------------------------------------------------------資源鏈接----------------------------------------------------------------------- 翻譯來源 ?Sencha Cmd官方網站： [http://www.sencha.com/products/extjs/up-and-running/cmd-getting-started](http://www.sencha.com/products/extjs/up-and-running/cmd-getting-started) ------------------------------------------------------------------------------------------------------------------------------------------------ ### **帶著Ext JS 5來使用sencha cmd** ------------------------------------------------------------------- 這個指導通過處理使用 sencha cmd的sencha generate app命令來創建應用程序，本文是以允許一個應用程序來結束的 處理更新一個存在的應用程序來體驗Sencha cmd是在本章結束的時候介紹的，首先理解什么是"ideal"和“default”是很重要的，在默認的結構和已經存在的應用程序中驅動更新是有很大區別的。 ### **學習基礎：** ------------------ ? 如果想閱讀以下內容，那么你需要先了解上節內容：[http://blog.csdn.net/sushengmiyan/article/details/38295575](http://blog.csdn.net/sushengmiyan/article/details/38295575) ### **一鍵生成你的應用程序代碼：** ------------------------------------------------------------ 我們的出發點就是使用命令來產生一個應用程序，執行以下命令： sencha generate app -ext MyApp E:\senchaworkspace\MyApp 可以看到如下執行結果   以上命令會從官網下載試用版本的ext代碼到你本地，如果你已經購買正版代碼，那么需要使用下一節（-sdk命令來生成你的應用程序）在你的硬盤文件夾下可以看到：   這表明自動生成了你的程序框架。 需要注意的是，生成的EXTjs 是商業體驗版本，如果你購買了，那么你需要下載ext js的zip包，并且使用-SDK命令來制定SDK的路徑，這樣，就不會去默認下載SDK而是按照你本地的文件來生成了。 命令如下： sencha -sdk /這里是你的sdk路徑/ generate app MyApp 你的App的路徑。如 sencha -sdk c:sencha5.0.0 generate app OASystem d:\oasys 執行完成之后可以看到如下的文件夾路徑： ~~~ .sencha/ # Sencha-specific files (for example, configuration) app/ # Application-specific content Boot.js # Private, low-level dynamic loader for JS and CSS Microloader.js # Loads app based on app.json content sencha.cfg # Application configuration file for Sencha Cmd build-impl.xml # Standard application build script *-impl.xml # Implementations of various build phases defaults.properties # Default values and docs for build properties ext.properties # Build property values specific to Ext JS *.defaults.properties # Build property values by env (e.g. "testing") plugin.xml # Application-level plugin for Sencha Cmd codegen.json # Data for merging generated code during upgrade workspace/ # Workspace-specific content (see below) sencha.cfg # Workspace configuration file for Sencha Cmd plugin.xml # Workspace-level plugin for Sencha Cmd ext/ # A copy of the Ext JS SDK cmd/ # Framework-specific content for Sencha Cmd sencha.cfg # Framework configuration file for Sencha Cmd packages/ # Framework supplied packages ext-theme-classic/ # Ext JS Theme Package for Classic ext-theme-neptune/ # Ext JS Theme Package for Neptune ... # Other theme and locale packages src/ # The Ext JS source ... index.html # The entry point to your application app.json # Application manifest app.js # Launches the Application class app/ # Your application's source code in MVC structure model/ # Folder for application model classes store/ # Folder for application stores view/ # Folder for application view classes main/ # Folder for the classes implementing Main.js # The Main View MainModel.js # The `Ext.app.ViewModel` for the Main View MainController.js # The `Ext.app.ViewController` for the Main View Application.js # The `Ext.app.Application` class packages/ # Sencha Cmd packages build/ # The folder where build output is placed ~~~ 這個路徑和上方文件夾截圖是沒有區別的都是一樣的。 ### **構造你的應用程序：** ---------------------------------------- 只需要執行以下命令就可以構造你的應用程序打包了 sencha app build,這個命令需要你在你的應用程序文件夾下執行哦。可以看到我的執行過程如下：  需要注意不能使用-sdk命令了，使用會出現問題哦 執行完成之后可以看到增加了build目錄，下方就是包含了js代碼 sass還有主題的文件夾。 ### **Sencha 的網絡服務容器：** ---------------------------------------------------- 使用 sencha web start命令來開啟你的服務。服務允許你將本地應用程序當做網絡服務。   這個命令將1841端口制定為當前的訪問端口，如果想停止服務就執行如下命令： sencha web stop或者ctrl+c來結束服務 想訪問你的服務，只需要在瀏覽器中執行如下路徑： http://localhost:1841? 當我們訪問的時候，可以看到默認生成的網頁如下： 如果你不想使用1841端口，你可以在執行的時候制定端口號碼：sencha -port 8080 web start 擴展你的應用程序 使用 sencha generate 命令幫你你快速的創建一個mvc的組件包像controllers和models? 執行以下命令sencha help generate你可以看到有如下的擴展信息： 重要：為了執行命令，你需要在當前應用程序的路徑下執行才可以。 ### **增加一個新的models** -------------------------------------------- 使用sencha generate model 命令就可以。 如圖?   這樣就創建了一個User的Model包含三個屬性 ### **增加一個新的Controllers** ----------------------------------------------------- 類似上述命令，執行 sencha generate controller Central  ### **增加一個view** ------------------------------ 也是一樣執行 sencha generate view SomeView   ### 客戶化定制構造程序 ----------------------------------------- 現在又多種多樣的配置選項可以使用在 ”.sencha/app/sencha.cfg“文件夾下，在只有一張頁面的情況下，可以忽略”.sencha/workspace“配置文件夾 ### **classpath類路徑** ---------------------------------- sencha app build 命令制定去哪里找到你的應用程序的代碼全部依賴于app.classpath配置，它是在”.sencha/app/sencha.cfg“文件夾下的。默認的數值是 ~~~ app.classpath=${app.dir}/app,${app.dir}/app.js ~~~ ### **更高層次的閱讀：** ----------------------------------- 想了解更多的關于sencha cmd的命令處理，你額可以參考 Inside the app build process 更新你的應用程序 使用 sencha app upgrade[新的路徑] 對于已經存在的應用程序來說，可能默認的不是index.html這時候需要你在app.json中制定： ~~~ { ... "indexHtmlPath": "index.php" } ~~~