文档帮助

术语、图标和标签

许多类在使用配置对象创建(实例化)类时使用简写名称。简写名称称为别名(如果类扩展了 Ext.Component,则称为xtype)。别名/xtype 列在适用类的类名旁边,以便快速参考。

访问级别

框架类或其成员可以指定为私有受保护。否则,类/成员为公共公共受保护私有是访问描述符,用于传达类或类成员的使用方式和时间。

成员类型

成员语法

以下是一个示例类成员,我们可以将其分解以显示类成员的语法(在本例中,从 Ext.button.Button 类中查看的 lookupComponent 方法)。

lookupComponent ( item ) : Ext.Component
受保护

在初始化items配置期间或添加新项目时,将原始配置对象添加到此容器时调用添加,或{@link #insert 插入}。

此方法将传递的对象转换为实例化的子组件。

当需要对子项创建应用特殊处理时,可以在子类中覆盖此方法。

参数

item :  Object

正在添加的配置对象。

返回值
Ext.Component

要添加的组件。

让我们看看成员行的每个部分

成员标志

API 文档使用许多标志来进一步传达类成员的功能和意图。标签可以用文本标签、缩写或图标表示。

类图标

- 表示框架类

- 单例框架类。*有关更多信息,请参阅单例标志

- 组件类型框架类(Ext JS 框架中扩展 Ext.Component 的任何类)

- 表示类、成员或指南在当前查看的版本中是新的

成员图标

- 表示类型为config的类成员

- 表示类型为property的类成员

- 表示类型为 method 的类成员

- 表示类型为 event 的类成员

- 表示类型为 theme variable 的类成员

- 表示类型为 theme mixin 的类成员

- 表示类、成员或指南在当前查看的版本中是新的

类成员快速导航菜单

在 API 文档页面上的类名下方,有一排按钮,对应于当前类拥有的成员类型。每个按钮都显示了按类型划分的成员数量(此数量会在应用过滤器时更新)。单击按钮将导航到该成员部分。将鼠标悬停在成员类型按钮上将显示一个弹出菜单,其中包含该类型的所有成员,以便快速导航。

Getter 和 Setter 方法

与类配置选项相关的 Getter 和 Setter 方法将显示在方法部分以及 API 文档和成员类型菜单的配置部分中,紧挨着它们所操作的配置。Getter 和 Setter 方法的文档将在配置行中找到,以便于参考。

历史记录栏

您的页面历史记录保存在本地存储中,并在顶部标题栏下方显示(使用可用的空间)。默认情况下,仅显示与您当前查看的产品/版本匹配的页面搜索结果。您可以通过单击历史记录栏右侧的 按钮并选择“全部”单选按钮来扩展显示的内容。这将显示所有产品/版本的最近页面历史记录栏。

在历史记录配置菜单中,您还会看到最近页面访问的列表。结果会根据“当前产品/版本”和“全部”单选按钮进行过滤。单击 按钮将清除历史记录栏以及本地存储中的历史记录。

如果在历史记录配置菜单中选择了“全部”,则“在历史记录栏中显示产品详细信息”的复选框选项将被启用。选中后,每个历史页面的产品/版本将与历史记录栏中的页面名称一起显示。将光标悬停在历史记录栏中的页面名称上也会显示产品/版本作为工具提示。

搜索和过滤器

可以使用页面顶部的搜索字段搜索 API 文档和指南。

在 API 文档页面上,还有一个过滤器输入字段,该字段使用过滤器字符串过滤成员行。除了按字符串过滤外,您还可以按访问级别、继承和只读来过滤类成员。这是使用页面顶部的复选框完成的。

API 类导航树底部的复选框过滤类列表,以包含或排除私有类。

单击空的搜索字段将显示您最近的 10 次搜索,以便快速导航。

API 文档类元数据

每个 API 文档页面(除了 JavaScript 原语页面)都有一个与该类相关的元数据的菜单视图。此元数据视图将包含以下一项或多项

展开和折叠示例和类成员

可运行示例(Fiddles)在页面上默认展开。您可以使用代码块左上角的箭头单独折叠和展开示例代码块。您还可以使用页面右上角的切换按钮切换所有示例的折叠状态。切换所有状态将在页面加载之间记住。

类成员在页面上默认折叠。您可以使用成员行左侧的箭头图标或使用右上角的展开/折叠所有切换按钮全局展开和折叠成员。

桌面与移动视图

在较窄的屏幕或浏览器上查看文档将导致视图针对较小的外形尺寸进行优化。桌面视图和“移动”视图之间的主要区别在于

查看类源代码

可以通过单击 API 文档页面顶部的类名称来查看类源代码。可以通过单击成员行右侧的“查看源代码”链接来查看类成员的源代码。

Cmd


顶部

Sencha Cmd 简介

Sencha Cmd 是一款跨平台命令行工具,它提供了许多围绕应用程序整个生命周期的自动化任务,从生成新项目到将应用程序部署到生产环境。

认识 Sencha Cmd

Sencha Cmd 提供了一组强大的、节省时间的特性,这些特性协同工作,并与 Sencha Ext JS 和 Sencha Touch 框架协同工作。Sencha Cmd 提供以下功能

  • 代码生成工具:代码生成工具,用于生成整个应用程序并使用新的 MVC 组件扩展这些应用程序。
  • JS 编译器:一个框架感知的 JavaScript 编译器,它理解 Sencha 框架的语义,并且可以从您的源代码生成最小占用空间的构建。编译器可以优化 Sencha 框架提供的许多高级语义,以减少应用程序的加载时间。
  • Web 服务器:提供一个轻量级 Web 服务器,用于从 localhost 提供文件。
  • 包管理系统:分布式包管理系统,用于轻松集成他人创建的包(例如 Ext JS 主题)或来自 Sencha 包存储库的包。
  • Sencha Web Application Manager 集成 - 轻松将新应用程序版本发布到 Sencha Web Application Manager 服务器。
  • 工作区管理:帮助在多个应用程序之间共享框架、包和自定义代码。
  • 构建脚本:为应用程序和包生成的构建脚本,带有“之前”和“之后”扩展点,因此您可以自定义构建过程以满足您的特定需求。
  • Cordova / PhoneGap 集成:原生打包,将 Web 应用程序转换为一流的移动应用程序,该应用程序可以访问设备功能,并可以在应用商店中分发。
  • 图像捕获:将 CSS3 功能(例如 border-radius 和 linear-gradient)转换为适用于传统浏览器的精灵。
  • 调整工具:强大的代码选择工具,用于调整应用程序最终构建中包含的内容,确定页面之间的通用代码,并使用高级集合运算划分共享代码,以获得您想要的构建。
  • 灵活的配置系统:允许在应用程序或工作区级别或机器上的所有工作区中指定命令选项的默认值。
  • 日志记录:强大的日志记录,可帮助您了解命令的内部工作原理并促进故障排除。
  • 第三方软件:对于 Sencha Touch 和 Ext JS 5 及更早版本,Sencha Cmd 包含一个兼容版本的 Compass 和 Sass。
  • 代码生成钩子:可以特定于一个页面,也可以由工作区中的所有页面共享,例如,在生成新模型时检查编码约定或指南。

兼容性

Sencha Cmd 支持 Sencha Ext JS 版本 4.1.1a 或更高版本和 Sencha Touch 版本 2.1 或更高版本。Sencha Cmd 的许多功能都需要框架支持,这些支持仅在这些版本或更高版本中可用。一些低级命令可用于旧版本的 Sencha 框架或 JavaScript。

如果您使用的是旧版本的 Ext JS,您可以使用 Sencha Cmd 的 build 命令通过您的 JSB 文件进行构建。换句话说,Sencha Cmd 可以替换 JSBuilder 以生成 JSB 文件中描述的文件的压缩构建。Sencha Cmd 不会更新您的 JSB 文件,就像已弃用的 SDK Tools v2 所做的那样。

Sencha Touch 2.0 和 Sencha Ext JS 4.0 需要已弃用的 SDK Tools v2,它不能与更高版本的 Touch 或 Ext JS 一起使用。

系统设置

Sencha Cmd 6 安装程序包含构建 Ext JS 6 应用程序所需的所有软件,因此只需下载 Sencha Cmd

使用旧框架

如果您使用的是旧版本的 Ext JS 或 Sencha Touch,您需要在安装程序中选中“Compass 扩展”选项。

Compass extension

您还需要安装 Ruby 来编译使用 Sass 的主题和应用程序。Ruby 因操作系统而异。

  • Windows:从 rubyinstaller.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。如果您需要仅 CLI 的安装过程,只需从您的命令行工具运行以下命令

Mac OSX

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

Linux

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

Windows

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

这将安装没有 GUI 安装程序的 Sencha Cmd。

更改安装路径

如果您需要更改安装路径,可以使用“dir”标志指定它。例如

sudo SenchaCmd-6.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

安装程序完成后,启动一个新的控制台或终端以获取对 PATH 环境变量的更改。

由于可以并排安装多个版本的 Sencha Cmd,因此您可以安全地尝试新版本,只需卸载它们(或调整 PATH 或符号链接)即可返回到以前的版本。但是,使用 sencha app upgrade 升级您的应用程序更像是源代码控制项目,如果您降级到旧版本的 Sencha Cmd,您可能需要“回滚”。

静默升级 Sencha Cmd

一些用户可能希望在没有安装程序 GUI 的情况下升级 Sencha Cmd。如果您需要仅 CLI 的升级过程,只需从您的命令行工具运行以下命令

sencha upgrade --unattended

这将升级没有 GUI 安装程序的 Sencha Cmd。

Beta 版本

如果您想检查 Beta 版本,请使用

sencha upgrade --check --beta

要安装最新的 Beta 版本

sencha upgrade --beta

注意 最新的版本可能在“beta”或稳定通道中。也就是说,sencha upgrade --beta 可能会安装一个早于当前版本的 Beta 版本,而当前版本将由 sencha upgrade 安装。

命令基础

Sencha Cmd 的功能按类别(或模块)和命令排列

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

可以使用 help 命令获得帮助。

sencha help [module] [action]

例如,试试这个

sencha help

显示当前版本和可用的顶级命令。例如

Sencha Cmd v6.0.0.202
...

Options
  * --beta, -be - Enable beta package repositories
  * --cwd, -cw - Sets the directory from which commands should execute
  * --debug, -d - Sets log level to higher verbosity
  * --info, -i - Sets log level to default
  * --nologo, -n - Suppress the initial Sencha Cmd version display
  * --plain, -pl - enables plain logging output (no highlighting)
  * --quiet, -q - Sets log level to warnings and errors only
  * --sdk-path, -sd - The location of the SDK to use for non-app commands
  * --strict, -st - Treats warnings as errors, exiting with error if any warnings are present
  * --time, -ti - Display the execution time after executing all commands

Categories
  * app - Perform various application build processes
  * compile - Compile sources to produce concatenated output and metadata
  * cordova - Quick init Support for Cordova
  * diag - Perform diagnostic operations on Sencha Cmd
  * fs - Utility commands to work with files
  * generate - Generates models, controllers, etc. or an entire application
  * manager - Commands for interacting with Sencha Web Application Manager.
  * manifest - Extract class metadata
  * package - Manages local and remote packages
  * phonegap - Quick init support for PhoneGap
  * repository - Manage local repository and remote repository connections
  * template - Commands for working with templates
  * theme - Commands for low-level operations on themes
  * web - Manages a simple HTTP file server

Commands
  * ant - Invoke Ant with helpful properties back to Sencha Cmd
  * audit - Search from the current folder for Ext JS frameworks and report their license
  * build - Builds a project from a legacy JSB3 file.
  * config - Load a properties file or sets a configuration property
  * help - Displays help for commands
  * js - Executes arbitrary JavaScript file(s)
  * upgrade - Upgrades Sencha Cmd
  * which - Displays the path to the current version of Sencha Cmd

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

详细输出

Sencha Cmd 5 中的调试输出级别已大幅降低。您可以通过在命令中包含 -info 标志来重新启用详细输出。例如

 sencha -info app watch

此命令将提供有关初始化期间和文件系统更新时发生的后台进程的更多信息。

-info 标志可用于任何生成输出的 Sencha 命令。

当前目录

在许多情况下,Sencha Cmd 要求您设置特定的当前目录。或者它可能只需要了解有关相关 Sencha SDK 的详细信息。当从生成的应用程序文件夹运行 Sencha Cmd 时,可以自动确定 SDK(或“框架”),或者对于某些命令,可以从解压缩的 SDK 文件夹中确定 SDK。

重要 对于以下命令,Sencha Cmd 需要从生成的应用程序的根文件夹运行。如果不在应用程序的根文件夹中运行,这些命令将失败。

* `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 不需要 Ruby。

错误的当前目录

一个常见的错误是执行需要当前目录为解压缩的 SDK 目录或应用程序目录的命令,但尚未设置这样的目录。如果未满足此要求,Sencha Cmd 将显示错误并退出。

注意 有效的应用程序目录是由 Sencha Cmd 生成的目录。

解析依赖项时出错

sencha app build 命令通过读取您的 index.htmlapp.json 文件并扫描所需的类来工作。如果您的应用程序未正确声明其所需的类,则构建通常会完成,但不会包含应用程序所需的所有类。

为了确保您已指定所有必需的类,请始终在启用调试器控制台的情况下进行开发(IE/Chrome 中的“开发者工具”,FireFox 中的 FireBug 以及 Safari 中的 Web Inspector),并解决所有出现的警告和错误消息。

每当您看到类似这样的警告时

[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.jsExt.application(...) 语句内的 requires 数组属性中。

Cmd