sencha app watch php,Sencha Cmd使用指南

查看Cmd版本

使用 sencha 命令查看当前cmd版本信息

sencha

显示如下

Sencha Cmd v6.1.2.15

Sencha Cmd provides several categories of commands and some global switches. In

most cases, the first step is to generate an application based on a Sencha SDK

such as Ext JS or Sencha Touch:

sencha -sdk /path/to/sdk generate app MyApp /path/to/myapp

Sencha Cmd supports Ext JS 4.1.1a and higher and Sencha Touch 2.1 and higher.

To get help on commands use the help command:

sencha help generate app

For more information on using Sencha Cmd, consult the guides found here:

http://docs.sencha.com/cmd/

使用Sencha Cmd创建Extjs 6项目

以下使用指南,从新建一个ExtjsWebapp 开始,到运行应用程序结束

创建Extjs应用程序

sencha -sdk /path/to/ext6 generate app MyApp /path/to/my-app

打开cmd,通过以上命令创建应用程序,-sdk 参数后面是你Extjs6的安装路径,/path/to/my-app 是生成项目的路径

通过以上命令生成的项目会有以下的目录结构.

.sencha/ # Sencha具体的配置文件目录 (主要配置)

app/ # 应用程序相关的配置

sencha.cfg # Sencha Cmd 应用程序的配置文件

Boot.js # Private, low-level dynamic loader for JS and CSS

Microloader.js # 基于app.json加载app

build-impl.xml # 应用程序构建脚本

*-impl.xml # 各个构建阶段的执行脚本

defaults.properties # 构建项目时的默认值和说明

ext.properties # Extjs的构建属性和说明

*.defaults.properties # 各种环境的构建属性(列入package.defaults.properties)

plugin.xml # Sencha Cmd 应用级别的插件

codegen.json # 在更新时合并生成代码时的记录

workspace/ # workspace的相关配置

sencha.cfg # Sencha Cmd 工作空间的配置文件

plugin.xml # Workspace-level Sencha Cmd 工作空间级别的插件

ext/ # 一份Extjs Jdk的拷贝

cmd/ # Sencha Cmd 针对框架的内容

sencha.cfg # Sencha Cmd 框架配置文件

classic/ # 与classic工具包相关的包

classic/ # Extjs classic 工具包

theme-neptune/ # Neptune主题工具包

theme-triton/ # Triton主题工具包

modern/ # 与modern工具包相关的包

modern/ # Ext JS Modern 工具包

theme-neptune/ # Neptune主题工具包

theme-triton/ # Triton主题工具包

packages/ # 框架提供的包

charts/ # 图表 package

ux/ # Extjs 命名空间ux相关的包

index.html # 应用程序入口

app.json # Application manifest应用程序描述文件

app.js # 运行应用程序的类文件继承自Application.js

app/ # 应用程序MVC模式的源代码

model/ # model 层代码

store/ # store层代码(dao层)

view/ # 视图层代码

main/ # 主页面相关视图代码

Main.js # 主视图

MainModel.js # 主视图的视图模型

MainController.js # 主视图的空间逻辑代码

Application.js # 应用程序类文件

packages/ # Sencha Cmd 相关的包

workspace.json # Workspace 描述文件

build/ # 构建项目的输出目录

打包Web程序

sencha app build

这个命令将打包你的html、js、主题文件代码到build文件夹

注意: 执行以上命令必须在Extjs应用程序根目录下

开发模式

Sencha Cmd 可以基于应用程序的app.json文件和源代码生成一个引导文件(bootstrap).引导程序会传递相关信息给动态类加载器(Ext.loader和Microloader),引导程序并不需要手动的去维护它.

引导程序不会受到你JavaScript源代码的影响,所以正常的工作流程,比如编辑、保存、重新加载、复制可以使引导程序像预期的那样工作.但是修改样式、移动或者重命名Js的文件将使引导信息失效另外生成CSS需要运行程序.

有两种基本的途径可以更新引导程序

sencha app watch

使应用程序在浏览器中一直保持运行状态的最简单的方式是运行 app watch:

sencha app watch

这个命令相当于执行了一个development build命令,同时也启动了Sencha Cmd内部的web server服务器

app watch会开始等待并监视文件的变化,一旦文件发生更改,Sencha cmd会重新自动进行develpment build之后继续等待.

可以通过http://localhost:1841/ 对应用程序进行访问.

可以通过Ctrl+c停止运行app watch.

通过构建开发版应用

如果手动的更新bootstrap引导文件,有以下两个命令可以使用

sencha app build development

sencha app refresh

app refresh命令只会更新bootstrap引导文件的js代码部分.当仅仅是修改了js相关文件后使用这个命令

app build development内部实际上同样执行了app refresh领命,但是同时会对css文件进行重新编译.

app.json文件包含很多配置项以及相应的说明,另外workspace.json包含了工作空间以及一些额外的配置.

classpath配置项配置了项目的源代码文件路径,sencha app build命令会通过此配置查找项目的源文件并进行编译.

"classpath": [

"app",

"${toolkit.name}/src"

]

创建工作空间

sencha generate workspace /path/to/workspace

工作空间的目录结构如下:

workspace.json # 工作空间配置

sencha/

workspace/

sencha.cfg # Sencha Cmd配置文件

plugin.xml # Sencha Cmd插件

在工作空间中创建Extjs应用程序

mkdir apps //新建apps文件夹用来存放多个Extjs应用

cd apps //进入apps目录

//创建第一个应用时使用此命令,Cmd会自动根据命令中指定的框架路径将

//ext框架拷贝到workspace根目录.之后创建使用下面的命令

sencha -sdk /path/to/ext6 generate app MyApp /path/to/my-app

sencha generate app --ext NewApp newapp

上面--ext 指的就是配置文件中指定的extjs框架路径.

本地化设置

在app.json文件中的requires中添加"locale",告诉cmd应用需要locale设置,另外指定哪一种本地化文件. 例如"zh_CN".

"requires": [

"locale"

],

"locale": "zh_CN",