开始使用Sencha Cmd

使用Sencha Cmd

Sencha Cmd是一个跨平台的命令行工具，它提供了许多用于应用程序生命周期的自动化任务，从生成新项目到发布产品。

初览Sencha Cmd

Sencha Cmd提供了一组强有力、省时的特性，用在Sencha Ext JS和Sencha Touch框架。Sencha Cmd提供下面的能力：

  • 代码生产工具：代码生成工具生产整个应用程序，用MVC组件扩展这些应用程序。
  • JS 编译器：一个能理解Sencha框架含义的JavaScript编译器，从你的源码构建最小的版本。编译器能优化许多Sencha框架的高层语义，以减少应用程序的载入时间。
  • Web 服务: 提供一个轻量级的web服务，服务本地主机的文件。
  • 软件包管理系统: 分发软件包管理系统简化其它创建的软件包(如Ext JS Themes)或者来自Sencha软件包仓库的。
  • 管理工作区: 帮助共享框架、包和跨多应用的自定义代码。
  • 构建脚本: 为应用和包构建脚本，用 "before"和"after"扩展点方便你定制构建过程来适合你的特殊需求。
  • 整合Cordova / PhoneGap: 原生包用来把一个web应用转换成一流的移动应用，可以调用设备功能，发布到App商店。
  • 图像识别: 把CSS3的特性转换成老旧浏览器可识别的。
  • 调优工具: 强大的代码选择工具，用于优化应用程序包含在最后构建的应用程序里，确定页面之间的通用代码，使用高级分区来共享代码，按你的意愿进行构建。
  • 灵活的配置系统: 允许一台电脑上在应用程序、工作区级或者框所有工作区启用配置默认命令选项。
  • 日志记录: 强壮的日志记录帮助你理解命令的内部工作，快速分析问题。
  • 第三方软件: 为了Sencha Touch、Ext JS 5和更老的版本，Sencha Cmd包含了一致的Compass和Sass版本。
  • 代码生成钩子: 可以指定到一页或者共享给工作区里的所有页，例如，检查代码的规范或者新生产的model。

兼容性

Sencha Cmd支持Sencha Ext JS 4.1.1a或者更高版，Sencha Touch或者更高。很多Sencha Cmd的特性需要框架支持，这些特征只对这些版本有效。一些低级命令可以用在老版本的Sencha框架和普通JavaScript。

如果你使用一个旧版的Ext JS，你可以用Sencha Cmd的构建命令构建你的JSB文件。换句话说Sencha Cmd可以替代JSBuilder来压缩生成JSB文件。Sencha Cmd不像用SDK工具v2那样更新你的JSB文件。

Sencha Touch 2.0和Sencha Ext JS 4.0需要SDK工具v2, 它不能用在后面新的Touch和Ext JS。

系统设置

Sencha Cmd 7安装包包含了构建Ext JS 7应用都所有工具软件，所有只需要下载Sencha Cmd到你的平台。

注意:

Windows 32-bit安装包不再带有嵌入的JRE。如果你使用32位Windows，你必须在你的系统安装一致的Java版本(看下面)。

依赖

Java

  • Sencha命令6.6.0和更新版需要Oracle JRE (SE) 8-11或者OpenJDK 8-11。

Node

  • Sencha需要Node JS 8+ 和 npm 5+来支持Fashion node module等等。

使用老版框架

如果你使用老板Ext JS或者Sencha Touch，你在安装时需要选择"Compass extension"项：


你还需要安装Ruby用Sass来编译主题和应用。Ruby有OS区别：

  • Windows: 从byinstaller.org下载Ruby。获取".exe"文件版本然后安装。
  • Mac OS: Ruby是预装的。你可以用Ruby -v命令测试Ruby是否安装。
  • Ubuntu: 使用sudo apt-get install ruby2.0.0下载Ruby。

如果你要使用Cordova或者PhoneGap，这些工具有其它软件需求。查看整合Cordova或者 PhoneGap.

安装程序会在PATH环境变量登记一条。

验证安装

为了验证Sencha Cmd是否工作正常，打开一个命令行，改到你的应用目录，然后键入sencha命令。

你应该看到输出启动像这样：

Sencha Cmd v6.0.0.202
...

显示的确切版本号应该和你安装的版本一致。

静默安装Sencha Cmd

一些用户喜欢不用安装程序的GUI安装Sencha Cmd。如果你需要命令行安装，只需在命令行工具中简单的运行下面命令：

Mac OSX

SenchaCmd-7.x.y.z-osx.app/Contents/MacOS/JavaApplicationStub -q

Linux

SenchaCmd-7.x.y.z-linux(-i386|-amd64).sh -q

Windows

SenchaCmd-7.x.y.z-windows-(32|64)bit.exe -q

这会用无GUI的安装程序安装Sencha Cmd。

改变安装路径

如果你要改变安装路径，可以用"dir"标签配置它。例如：

sudo SenchaCmd-7.x.y.z-linux(-i386|-amd64).sh -q -dir "/opt"

注意: 你选择的安装路径可以需要修改权限。

升级Sencha Cmd

sencha upgrade让你升级Sencha Cmd。

检查Sencha Cmd的新版本:

sencha upgrade --check

不带--check项，sencha upgrade命令会下载并安装最新的版本:

sencha upgrade

然后安装程序执行，启动一个新的console或者teminal来修改你的PATH。

可以同时安装多个版本的Sencha Cmd，你可以安全的尝试新版然后卸载它们回到先前的版本(或者调整PATH、链接)。用sencha app upgrade升级你的应用,但是如果你想降级到老版的Sencha Cmd，你需要"回滚"更多代码控制项。

静默升级Sencha Cmd

一些用户喜欢不用安装程序GUI升级Sencha Cmd。如果你需要命令行来升级，只需在命令行工具运行下面命令：

sencha upgrade --unattended

这会用无GUI的安装程序升级Sencha Cmd。

测试版

如果你想检查测试版，用这个：

sencha upgrade --check --beta

安装最新的测试版：

sencha upgrade --beta

注意: 当前最新版可能是测试版或者稳定版。就是说，sencha upgrade --beta 可以安装测试版，在用sencha upgrade安装正式版之前。

基本命令

Sencha Cmd的功能放在categroy(或者module)和command中：

sencha [category] [command] [options...] [arguments...]

帮助信息使用help命令。

sencha help [module] [action]

例如，这样尝试：

sencha help

显示当前版本号和有效的顶层命令，例如：

Sencha Cmd v6.0.0.202
...

可选项
  * --beta, -be - 启用测试库
  * --cwd, -cw - 设置命令执行的目录
  * --debug, -d - 设置日志级别到更高级
  * --info, -i - 设置日志级别到默认
  * --nologo, -n - 取消Sencha Cmd版本显示
  * --plain, -pl - 启用普通日志输出(没有高亮)
  * --quiet, -q - 设置日志级别只有警告和错误
  * --sdk-path, -sd - SDK的位置
  * --strict, -st - 视警告为错误，如果有警告则退出错误
  * --time, -ti - 执行完命令后显示执行时间

Categories
  * app - 执行各种应用程序构建过程a
  * compile - 编译代码执行输出
  * cordova - 初始化支持Cordova
  * diag - 在Sencha Cmd执行诊断选项
  * fs - 工作在文件的命令
  * generate - 生成model,controller或者应用程序
  * manager - 用Sencha Web应用程序管理整合
  * manifest - 获得类元数据
  * package - 管理本地和远程包
  * phonegap - 支持PhoneGap初始
  * repository - 管理本地和远程库的连接
  * template - 带模板工作
  * theme - 在主题上的低级操作
  * web - 管理HTTP文件服务

命令
  * ant - 调用带属性的Ant返回Sencha Cmd
  * audit - 在当前目录搜索Ext JS框架并报告它们的许可
  * build - 从遗留JSB3文件构建一个项目
  * config - 载入或设置配置属性文件
  * help - 显示帮助
  * js - 执行JavaScript文件
  * upgrade - 升级Sencha Cmd
  * which - 显示当前Sencha Cmd的路径

注意: 确切的内容取决于你安装的版本。

详细输出

在Sencha Cmd 5中调试级的输出明显减少了。你可以在命令中加上-info标记重启详细输出。例如:

 sencha -info app watch

这个命令会提供有关初始化和文件更新时的更多的信息。

-info 标记可用在任何Sencha命令，处理输出信息。

当前目录

在许多情况，Sencha Cmd需要你设置当前的目录。或者需要知道Sencha SDK的详情。SDK (或者框架) 可以在Sencha Cmd运行生成应用目录时自动确定，从获取的SDK文件夹。

重要 下面的命令，需要从生成应用的根目录运行。命令没有运行在根目录会失败。

* `sencha generate ...` (for commands other than `app`, `package` and `workspace`)
* `sencha app ...`

包命令也是这样。在运行sencha package build, 当前目录必须是所需包的文件夹。

Sencha Cmd文档

许多Sencha Cmd的指南帮助你理解，建议你按顺序阅读。跳跃阅读可能会引起混淆，因为高级指南需要理解前面的指南。

在每个指南的开始有相关指南的连接。多数指南的结尾也有进一步阅读的连接。

超越基础

许多Sencha Cmd命令有有帮助的细节。help 命令是一个很好的参考，但你想知道所有的亮点，查看高级Sencha Cmd。

分析解决问题

以下是解决使用Sencha Cmd时遇到的常见问题的一些技巧。

Java堆空间

如果在执行Cmd命令后收到"java heap space"错误，你需要增加Java的内存使用分配。

Mac & Linux

在~/.bash_profile填加如下：

export _JAVA_OPTIONS="-Xms1024m -Xmx2048m"

Windows

你可以添加一个环境变量，或者在 startup.bat添加如下内容： 

set _JAVA_OPTIONS="-Xms1024m -Xmx2048m"

命令没有找到

如果在OSX/Linux运行 sencha 收到错误消息sencha: command not found 或者在Windows收到'sencha' is not recognized as an internal or external command, operable program or batch file，执行下面的步骤:

  • 关闭终端/命令窗然后重新打开一个。
  • 确保Sencha Cmd正确安装：
    • 安装的目录纯在。默认情况下，安装路径是：
      • Windows: C:\Users\Me\bin\Sencha\Cmd\{version}
      • Mac OS X: ~/bin/Sencha/Cmd/{version}
      • Linux: ~/bin/Sencha/Cmd/{version}


    • Sencha Cmd目录的路径被添加到PATH环境变量。从终端里，在Windows运行 echo %PATH% ，在Mac、Linux运行echo $PATH。Sencha Cmd 的目录会显示在输出里。如果没有，需要手工添加到PATH。


不能找到Ruby

如果有不能识别或者找到 "ruby" 的错误，这可能是因为Ruby没有安装或者没有在PATH里。查看前面系统安装章节。

使用Ext JS 6你不会看到这个消息，因为使用了Fashion替代Compass,Fashion不需要Rubby。

当前目录错误

一个常见的错误是执行了一个需要当前目录的命令，目录是SDK目录或者应用程序目录，但这个目录没有设置。这时，Sencha Cmd会显示错误并退出。

注意: 有效的应用程序目录是被Sencha Cmd产生的。

解析依赖时错误

sencha app build 命令通过读取你的index.html和app.json 文件，然后扫描需要的类。如果你的应用程序没有申明合适依赖类，通常构建会完成，但是不会包含你程序需要的所有类。

为了确保你描述了所有需要的类，始终在开启调试控制台下开发("Developer Tools" 在IE/Chrome, FireBug在FireFox，Web Inspector在Safari)，解决所有出现的警告和错误消息。

你看到这样的警告时：

[Ext.Loader] Synchronously loading 'Ext.foo.Bar'; consider adding 'Ext.foo.Bar'
explicitly as a require of the corresponding class

你应该在 requires 数组里添加'Ext.foo.Bar',加到依赖来源的类上。如果是应用层的依赖，加到app.js文件Ext.application(...)代码中的requires 数组里。

发布于 2020-09-23 13:37
JavaScript
ExtJS