缩小ExtJs

Question

我们有一个extjs应用程序，我们布局的结构与Sencha推荐的结构不完全匹配。在我们的结构中，我们没有app.js，但我们有一个js，我们提到自动加载和启动功能，例如下面的文件夹结构。

我们正在寻找的是缩小admin文件夹中的所有JS文件并创建一个用于生产的JS，我们尝试查看Sencha CMD但没有运气。有人可以指出我们缩小生产应用程序的确切步骤。

Ext.Loader.setConfig({
enabled: true,
paths: {
    'Admin': '../../script/js/ace/admin',
    'Ext.ux': '../../script/js/ext4/ux'
}
});

Ext.require('Admin.view.Administration');

Ext.application({
   name: 'Admin',
   appFolder: '../../script/js/ace/admin',
   launch: function() 
   {
     Ext.QuickTips.init();
     var me = this;
     Ext.create('Admin.view.Administration', {
        renderTo: 'contentPanel'
     });
   }
});

我们通过生成JSB3文件来尝试Cmd，我知道它在4.2.1中被弃用了但是我们认为这是唯一的选择。 我们尝试了以下命令，但没有生成jsb3文件

 sencha build admin.jsb3 <path to the admin js folder>

在此先感谢，任何指针都非常感谢。

我在Sencha论坛上发布了这个帖子，但我希望他们提供的选项要简单得多。

---

修改

我们有多个应用，在大多数情况下，我们尝试使用其他应用文件夹中的js。 例如，在下图中我们有实用程序和管理应用程序，我们使用SourceStore实用程序应用程序，自动加载器定义如下，以访问所需的

 Ext.Loader.setConfig({
  enabled: true,
  paths: {
    'Admin': '../../script/js/ace/admin',
    'Utilities': '../../script/js/ace/utilities',
    'Ext.ux': '../../script/js/ext4/ux'
  }
});

Answer 1

如果让Sencha CMD为您生成骨架应用程序，然后将现有代码与它合并，那么它将非常简单。

否则你也可以尝试使用Sencha的旧JSBuilder。

Answer 2

我建议您使用JAWR。基本上，您在jawr.properties文件中定义了捆绑包，并说明哪个文件或文件夹属于哪个捆绑包。 bundle实际上是一堆JS文件，它们被缩小为另一个，可以在servlets / JSP文件中单独请求。此外，您可以定义捆绑包之间的依赖关系（默认情况下是独立的），这样当您包含捆绑包时，其他捆绑包将自动包含在您的页面中。要包含捆绑包，请在servlet中使用特殊标记<jwr>。此外，您可以启用调试模式，以便在开发时可以调试代码。

工作原理：您将一个servlet添加到要在启动时加载的web.xml文件中，这也是生成这些包时的阶段（对您来说是透明的）。

一些提示：

• 检查this tutorial
• 因为在ExtJS中，文件的使用顺序很重要，所以在定义软件包时应该考虑它。

Answer 3

我强烈建议您使用grunt_sencha_dependencies插件查看grunt。 Here's a tutorial.

在高层次上，你所做的是： 1）运行sencha_dependencies插件以生成依赖项列表。 2）将输出传递给uglify插件以连接并缩小javascript。 3）使用grunt的复制任务替换为使用缩小的输出更新index.html。

编辑：我已经处理过Sencha CMD并且很糟糕。我不希望这是我最大的敌人。 Grunt更容易。

Answer 4

如果您愿意再次给Sencha CMD，可以尝试使用sencha compile命令。

sencha compile --classpath=folders-your-using,separated-by-commas concatenate --yui --output-file=output.js

- classpath是您要包含的文件夹。

- yui是压缩器

- output-file是javascript输出的名称。

我建议阅读sencha cmd指南。它们可能有点强烈，但是sencha命令包含了许多工具，它可能应该是：http://docs.sencha.com/cmd/5.x/advanced_cmd/cmd_reference.html