1、Sencha cmd学习笔记(一) 使你的sencha cmd跑起来

带着Ext JS 5来使用sencha cmd

-------------------------------------------------------------------
  这个指导通过处理使用 sencha cmd的sencha generate app命令来创建应用程序，本文是以允许一个应用程序来结束的
  处理更新一个存在的应用程序来体验Sencha cmd是在本章结束的时候介绍的，首先理解什么是"ideal"和“default”是很重要的，在默认的结构和已经存在的应用程序中驱动更新是有很大区别的。

学习基础：

------------------

如果想阅读以下内容，那么你需要先了解上节内容：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

执行完成之后可以看到如下的文件夹路径：

[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 property 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

这个路径和上方文件夹截图是没有区别的都是一样的。

构造你的应用程序：

----------------------------------------

只需要执行以下命令就可以构造你的应用程序打包了

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"
}
时间： 2024-08-25 00:05:15

1、Sencha cmd学习笔记(一) 使你的sencha cmd跑起来的相关文章

[学习笔记] Sencha Cmd 学习笔记 Sencha Cmd是什么

本文地址: http://blog.csdn.net/sushengmiyan/article/details/38295575 本文作者:sushengmiyan -------------------------------------------------------------资源链接----------------------------------------------------------------------- 翻译来源  Sencha Cmd官方网站: http://w

EasyARM i.mx28学习笔记——开箱使试用总结

0 前言 本月初(2014年8月)购买了周立功的EasyARM开发板,主控为EasyARM i.mx287.出于以下几个理由购买了该开发板. [1]主要原因,有人约我一起学习一起使用该开发板. [2]该开发板性价比较高,到手300元以内,比2440/2410开发板稍便宜些. [3]该开发板的CAN功能是一个特色. [4]通过学习EasyARM i.mx287,比较和树莓派的开发的不同. [建议] 如果亲爱的读者Linux的基础为0的话,请优先考虑树莓派.如果从此类ARM开发板入手,可能会搞不清楚

[ExtJS5学习笔记]第三十一节 sencha extjs 5使用cmd生成的工程部署到tomcat服务器

本文地址:http://blog.csdn.net/sushengmiyan/article/details/42940883 本文作者:sushengmiyan ------------------------------------------------------------------------------------------------------------------------------------ 使用sencha cmd build app 生成的工程,我们期望只使

[extjs5学习笔记]第三十八节 sencha CMD 6.0.0.220版本安装

本文地址:http://blog.csdn.net/sushengmiyan/article/details/46740381 简介 sencha cmd 6安装过程不需要UAC控制了对于widnows来说,对于mac来说是启动权限,之前的版本,我们比较麻烦的事情是需要下载正确的ruby版本才可以使用cmd,现在6.0版本之后,就不需要单独安装ruby了,新版取消了对ruby的依赖.新版cmd增加了对jre的默认安装,选择下载包的时候,可以直接下载带有jre的安装包,这样就不需要再单独安装jre

[ExtJS5学习笔记]第二十九节 sencha ext js 5.1.0中动态更换皮肤主题

本文地址:http://blog.csdn.net/sushengmiyan/article/details/42016107 本文作者:sushengmiyan ------------------------------------------------------------------------------------------------------------------------------------ 为方便起见,使用sencha cmd创建一个工程,使用app buil

Sencha学习笔记1: Getting Started with Sencha Touch - 官方Sencha Touch入门指南

官方英语原文:http://docs.sencha.com/touch/2.3.1/#!/guide/getting_started What is Sencha Touch? 初识Sencha Touch Sencha Touch is a high-performance HTML5 mobile application framework. You can use Sencha Touch to produce a native-app-like experience inside a b

sencha touch 学习笔记（二）开发前准备

1.选择一款能够兼容并调试sencha touch的浏览器 sencha touch之前是针对webkit内核进行设计的,所以chrome或safari浏览器可以很好的展现基于sencha touch的webapp.本人更倾向于chrome的开发者工具了,不仅可以查看dom元素,调试js,还能实时监控,cpu使用率,触发事件,内存占用等,是js开发的强力工具): 2.下载sencha cmd工具的下载并进行配置 软件名称:SenchaCmd-4.0.5.87-windows 软件下载:http:

NuGet学习笔记2——使用图形化界面打包自己的类库

NuGet相对于我们最重要的功能是能够搭建自己的NuGet服务器,实现公司内部类库的轻松共享更新.在安装好NuGet扩展后,我们已经能够通过NuGet轻松下载自己需要的类库,下面来说一说如何将自己的项目类库进行打包发布 使用图形界面打包自己的类库 NuGet可以使用NuGet.exe在命令行下进行类库打包,也可以使用图形化界面进行打包,估计很多朋友都和我一样对不熟悉的命令行有些感冒,所以在此仅讲述下使用图形化界面进行类库打包 1.首先下载 包包管理器 NuGetPackageExplorer,顾

NuGet学习笔记(2) 使用图形化界面打包自己的类库[转]

来自:http://www.cnblogs.com/lzrabbit/archive/2012/05/01/2477607.html 关于NuGet园子里已经有不少介绍及使用经验,本文仅作为自己研究学习NuGet一个记录. 初次认识NuGet是在去年把项目升级为MVC3的时候,当时看到工具菜单多一项Library Package Manager,右键项目文件多了一项Manage Nuget Packages...,这是个神马玩意儿,当时是一头雾水,后台查了些资料才知到NuGet是 Visual