1. Sencha cmd learning Note (a) make your Sencha cmd run up

Source: Internet
Author: User

With ext JS 5来 using Sencha cmd

This guide creates an application by processing the Sencha Generate App command that uses Sencha cmd, which is used to allow an application to end
Dealing with updating an existing application to experience Sencha CMD is introduced at the end of this chapter, it is important to first understand what "ideal" and "default" are, and there is a big difference between the default structure and the existing application that drives the update.

Learning Basics:


If you want to read the following, then you need to understand the previous section: http://blog.csdn.net/sushengmiyan/article/details/38295575

generate your application code with one click:


Our starting point is to use commands to generate an application that executes the following command:
Sencha Generate App-ext MyApp E:\senchaworkspace\MyApp

You can see the following execution results

The above command will download the trial version of Ext code from the official website to your local, if you have purchased genuine code, then you need to use the next section (-SDK command to build your application) in your hard disk folder can be seen:

This indicates that your program framework is automatically generated.

Note that the generated ExtJS is the commercial experience version, if you buy, then you need to download Ext JS Zip package, and use the-SDK command to develop the path of the SDK, so that will not go to the default download SDK, but according to your local files to build.

The command is as follows: SENCHA-SDK/Here is the path to your SDK path/Generate app MyApp your app. such as SENCHA-SDK c:sencha5.0.0 generate app Oasystem D:\oasys

After execution, you can see the following folder path:

[Plain]View Plaincopy
  1. . sencha/# sencha-specific files (for example, configuration)
  2. app/# application-specific Content
  3. Boot.js # Private, low-level dynamic loader for JS and CSS
  4. Microloader.js # Loads app based on App.json content
  5. SENCHA.CFG # application configuration file for Sencha CMD
  6. Build-impl.xml # Standard Application build Script
  7. *-impl.xml # Implementations of various build phases
  8. Defaults.properties # Default values and docs for build properties
  9. Ext.properties # Build property values specific to Ext JS
  10. *.defaults.properties # Build Values by env (e.g. "testing")
  11. Plugin.xml # Application-level plugin for Sencha CMD
  12. Codegen.json # Data for merging generated code during upgrade
  13. workspace/# workspace-specific content (see below)
  14. SENCHA.CFG # Workspace configuration file for Sencha CMD
  15. Plugin.xml # Workspace-level plugin for Sencha CMD
  16. ext/# A copy of the EXT JS SDK
  17. cmd/# framework-specific content for Sencha CMD
  18. SENCHA.CFG # Framework configuration file for Sencha CMD
  19. packages/# Framework supplied packages
  20. ext-theme-classic/# EXT JS Theme package for Classic
  21. ext-theme-neptune/# EXT JS Theme package for Neptune
  22. ... # other theme and locale packages
  23. src/# the Ext JS source
  24. ...
  25. Index.html # The entry point to your application
  26. App.json # application Manifest
  27. App.js # launches the Application class
  28. app/# Your Application ' s source code in MVC structure
  29. model/# Folder for Application model classes
  30. Store/# Folder for application stores
  31. view/# Folder for application view classes
  32. main/# Folder for the classes implementing
  33. Main.js # The Main View
  34. Mainmodel.js # the ' Ext.app.ViewModel ' for the Main View
  35. Maincontroller.js # the ' Ext.app.ViewController ' for the Main View
  36. Application.js # the ' Ext.app.Application ' class
  37. packages/# Sencha CMD Packages
  38. build/# The folder where build output is placed

There is no difference between this path and the top folder is the same.

to construct your application:


Simply execute the following command to construct your application to package

Sencha app Build, this command requires you to execute it under your application folder. You can see that my execution process is as follows:

Need to be careful not to use the-SDK command, the use of the problem will occur OH

After execution, you can see the addition of the build directory, which contains the JS code sass and the theme folder.

Sencha Network SERVICE container:


Use the Sencha Web Start command to start your service. The service allows you to use a local application as a network service.

This command will set port 1841 as the current access port, and if you want to stop the service, execute the following command: Sencha Web stop or CTRL + C to end the service

To access your service, simply perform the following path in the browser:


When we visit, we can see that the default generated page is as follows:

If you do not want to use port 1841, you can set the port number at execution time: Sencha-port 8080 Web start

Extend your application

Use the Sencha generate command to help you quickly create an MVC component package like controllers and models

Execute the following command Sencha help generate you can see the following extended information:

Important: In order to execute the command, you need to execute it under the current application's path.

Add a new models


You can use the Sencha Generate Model command.

This creates a user's model with three properties

Add a new controllers


Similar to the above command, execute Sencha generate controller Central

Add a View


It's the same. Execute Sencha generate view Someview

Customized Custom Construction Program


Now a variety of configuration options can be used under the ". Sencha/app/sencha.cfg" folder, in the case of only one page, you can ignore the ". Sencha/workspace" Configuration folder

Classpath class Path


Sencha App build command the code where to find your application is all dependent on the App.classpath configuration, which is under the ". Sencha/app/sencha.cfg" folder. The default value is

a higher level of reading:


To learn more about Sencha cmd command handling, you can refer to Inside the app build process

Update your App

Use Sencha app to upgrade[New Path]

For applications that already exist, it is possible that the default is not index.html when you need to make it in App.json:

{    ...    "indexHtmlPath": "index.php"}

1. Sencha cmd learning Note (a) make your Sencha cmd run up

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.