小地鼠

本指南旨在帮助使用Sencha Cmd的开发商从ExtJS的4.1.1a+迁移到ExtJS的5.0.x中。即使此版本中有一些重要的变化，Sencha Cmd也试图使升级过程尽可能轻松。在使用之前我们的老工程需要符合下面的全部假设：

1.你的应用程序使用了 Ext JS 4.1.1a以上版本
2.你的应用程序使用了Ext JS建议的MVC模式
3.你的工程当前使用的是Sencha Cmd进行开发

由于时间，期限和支持许可的限制并不是所有的客户都使用最新版的Ext JS和Sencha Cmd。时间，期限和支持许可的限制往往决定了企业使用哪个版本的Ext JS。

抽出时间来升级到Ext JS的4.x和Cmd的4.x版的最新版本比直接升级到5.x顺利得多，这样可以确保你修复最近的许多bug和避免显著API的变化。

迁移过程
准备工作
清理
在迁移过程的第一步是确保你的源代码控制系统没有正在修改的版本，不建议变修改变改动。你可以用Sencha Cmd查看你的状态是否存在，确保状态会不会丢失。
安装合并工具（建议）
在升级过程中Sencha Cmd可能需要你手动合并一些文件。
好消息，像版本控制，有一些工具可以帮助解决这些合并冲突。Sencha Cmd的可以使用任何可视化的合并工具，你可以通过命令行（这是几乎所有的人）中运行。这一步是可选的，但强烈建议，因为它将使处理升级简单得多。
下面列出一些合并工具，有些是免费的有些是收费的
p4merge
SourceGear
kdiff3
Syntevo SmartSynchronize 3
TortoiseMerge – (part of TortoiseSVN)
AraxisMerge

接下来你将要配置Sencha Cmd去使用这些工具。

升级Sencha Cmd
接下来你要或者最新版本的Sencha Cmd，如果你已经安装了就版本的在你计算机上你可以使用下面命令来安装：
sencha upgrade –beta
又或者到以下页面去下载安装包
http://cdn.sencha.com/cmd/beta/5.0.0.116/release-notes.html
下载后安装Sencha Cmd，并重启你的控制台。

配置代码合并工具
如果你选择好了代码合并工具你需要配置两个属性到配置文件中：
cmd.merge.tool
cmd.merge.tool.args
配置文件“sencha.cfg”在Sencha Cmd的安装目录下

升级app
如果你已经准备好了上述步骤，你只需要在你的工程的根目录执行以下命令：
sencha app upgrade -ext
几分钟后你将会看到文字提示说你的应用程序升级成功。

加载器(Microloader)
在Sencha Cmd的以前的版本中，Ext JS的应用程序相对于Sencha Touch要遵循一个非常不同的加载过程。这主要是由于Sencha Touch的“ Microloader”。在版本Sencha Cmd4中Microloader从Sencha Touch搬进Sencha Cmd，但在当时的Microloader可能无法在所有支持Ext JS的浏览器上运行。

在Sencha Cmd4和Ext JS5中这一限制不再存在。这意味着Ext JS5应用程序现在可以使用与Sencha Touch相同的过程。

app.json
为了更好的使用这些功能，我们首先要转换app.json文件中的“x-compile”类型的注释到microloader脚本中。通常你需要转移script和css引用。按照以前的Sencha Cmd版本生成的文件应该是这样的：
[code lang=”js”]
<!– <x-compile> –>
<!– <x-bootstrap> –>
<link rel="stylesheet" href="bootstrap.css">
<script src="../ext/ext-dev.js"></script>
<script src="bootstrap.js"></script>
<!– </x-bootstrap> –>
<script src="app.js"></script>
<!– </x-compile> –>
[/code]

上面的标记应改为这样：

[code lang=”js”]
<script id="microloader" type="text/javascript" src="bootstrap.js"></script>
[/code]

bootstrap.js文件s是Sencha Cmd产用于加载microloader。此文件只用在开发模式。上面的脚本标记将用于替换之前的build，就像替换之前的“x-compile”代码块

相当于“app.json”看起来像这样：
[code lang=”js”]
{
"framework": "ext",
"css": [
{
"path": "bootstrap.css",
"bootstrap": true
}
],
"js": [
{
"path": "app.js",
"bundle": true
}
]
}
[/code]

你可能会发现这里没有导入”ext-dev.js”文件。这是因为Sencha Cmd 5已经自动的为你添加工作空间。

还有许多其他选项，您可以在“app.json”文件探索。此文件可让您轻松访问包（使用”requires”），并允许您将选项传递到运行时。这是因为你的“app.json”文件的内容将被加载Ext.manifest。
更多有关信息请查看Microloader的文档

Build Properties

在之前版本的Sencha Cmd种，很多属性文件保存在.sencha/app目录下，在Sencha Cmd5中他们都被包含进app.json文件了。app.json内容中使用app.作为属性名的前缀，例如：

[code lang=”js”]
{
"theme": "ext-theme-crisp",
"sass": {
"namespace": "MyApp"
}
}
[/code]

用来替换”.sencha/app/sencha.cfg”:

[code lang=”js”]
app.theme=ext-theme-crisp
app.sass.namespace=MyApp
[/code]

还有很多属性不能在app.json中配置（通常是因为他们不是app.前缀的），但是还是建议如果有可能尽量把配置信息写到app.json文件中。更多的信息可以参考”.sencha/app/defaults.properties”。

查看（Watch）
最后一个步骤是去到你的应用程序根目录查看（Watch）你的app，使用Watch工具你可以实时的预览你的app。
你可以使用自己的webService或者使用自动工具直接http://localhost:1841, 你还可以通过下面属性更改发布信息
build.web.port=1841
build.web.root=${workspace.dir}

如果你想查看日志可以使用
sencha -info app watch
如果你想快速启动可以使用
sencha -quiet app watch