【翻译】使用新的Sencha Cmd 4命令app watch

原文：http://www.sencha.com/blog/using-the-new-app-watch-command-in-sencha-cmd-4/

作者：Don Griffin
Don Griffin is a member of the Ext JS core team. He was an Ext JS user for 2 years before joining Sencha and has over 20 years of software engineering experience on a broad range of platforms. His experience includes designing web application front-ends and back-ends, native GUI applications, network protocols and device drivers. Don’s passion is to build world class products that people love to use.

“sencha app watch”命令也许是在Sencha Cmd 4中引入的最大的新功能，该命令可大大简化进行小的修改和查看他们运行几秒后的持续过程。在本篇文章，将介绍app watch命令的基本操作以及如何自定义它的基本行为。

在app watch之前

在之前版本的Sencha Cmd，命令只执行单一的任务并在完成后退出。而日常任务可归结为三个常用的命令，可根据你的需要进行更改：

• sencha app refresh：可在添加类、删除类或更改类名后运行。它会通过Ext.Loader来更新bootstrap文件。

• sencha ant sass：该命令会根据Sass源代码重新生成CSS文件。它可在任何scss文件改变后运行。在Ext JS 4.1种，还可以使用compass watch通过检测文件系统的改变来更新Sass。

• sencha app build：执行所有生产步骤（如上面的sass步骤）。除了这之外，它还会复制资源文件到build/resources文件夹。如果对资源、Sass或其他东西进行更改，一个完整的生成通常是最好的选择。如果认为这些生成步骤并不是所需的，可通过选项“skip.slice=1”或“skip.sass=1”来设置。

由于在Ext JS 4.2和主题包的引入，compass watch再也理解不了主题的结构，这让sencha  ant sass成了生成Sass的唯一选择。但是，sass的生成步骤，会强制执行一个完整生成且比compass watch慢许多倍。

App watch介绍

要满足所有由Sencha Cmd包和主题包提供的灵活性，一个更聪明的compass watch是必需的。即使compass watch可以工作，但也只是工作流的一部分而已。理想的过程是可以管理所有的这些特设步骤并能确保物流是否需要，都能使应用程序的加载做到尽可能的快。

解剖应用程序

为了了解应用程序是如何工作的，将应用程序分解为基本部件非常有用：Javascript、样式（Sass）和资源（类似图片之类的东西）。Sencha框架（Ext JS和Sencha Touch）包含了相同的为主题所做的混合物。在Sencha Cmd，这种重复结构（Javascript、Sass、资源）被封装为包。

生成过程会从框架、所选择的主题（包括基本主题）和其他所需的包中获取这些片段并将他们与应用程序源代码结合起来编译应用程序。Sencha Cmd会利用这一过程的信息来启用应用程序的开发模式加载。换句话说，生产的副产品之一是，它会从应用程序的源代码获取到支持应用程序加载所需的数据。

（这段比较难理解，我直接给出原文：

he build process takes these pieces from the framework, the selected theme (and its base themes) and any other required packages and combines them with the application sources to produce the compiled application. Sencha Cmd leverages the information from this process to enable “development mode” loading of your application. In other words, one of the by-products of a build is that it gets the data needed to support loading your app directly from its sources.）

监视文件系统

为了能有效的维护这些信息，这里利用了Java 7监视文件系统变化的能力基于这个功能，app watch可以监控以下事情：

• 应用程序的源代码（app文件夹）

• 应用程序的Sass代码（sass文件夹）

• 应用程序的资源（resources文件夹）

• 主题包的源代码、Sass和资源（src、sass和resources）

• 主题的基本主题的source、Sass和resources文件夹

• 应用程序所要求的所有包的source、Sass和resources（在app.json文件中）

• 其他包（包括主题包）所需的所有包的source、Sass和resources（在package.json文件中）

为了准备好监控所需的东西，app watch启动时会为一个正常生成执行许多相同的步骤。。在生成阶段，所有以上提及的位置都会被关注，然后app watch会暂停而不是终止来监视文件系统的变化。

当文件夹的内容发生改变的时候，app watch会检测到变化并执行一套特别的生产步骤。一旦完成这些步骤，app watch又会暂停并等待更多的文件系统变化。根据不同的机器情况，大多数更改的周转时间大约是5秒（可能更少）。

不监视的文件

当应用程序的内容或所有它所需的包正在被监视的时候，这些东西的配置文件在当前并不会被监视。如果修改了app.json、package.json或不同的sencha.cfg中的一个，就需要停止（CTRL+C）并重新启动app watch。

第一步类似通常的sencha app build，不过在生成完成之后，app watch将会接管并显示“waiting for changes…（等待变化）”

一旦app.js保存后发生改变，app watch就会显示“triggering build…（触发生成）”

区别在于，该“生产”会完成进入待发状态，并只需要几秒钟。完成后，又会看到“waiting for changes…”信息并继续循环。

app watch内部一瞥

App watch的机制大部分是在创建的生成脚本中实现的。这意味着可以自定义这些步骤。虽然所采取的具体步骤Ext JS应用程序和Sencha Touch应用程序会有所不同，但基本结构是一样的。要查看更详细的信息，可以查看由主生成脚本“build.xml”导入的.sencha/app/watch-impl.xml文件。如果想了解更多有关生成脚本的信息，可参阅Sencha Cmd文档。