缩小ExtJ

Question

我们有一个extjs应用程序，我们布置的结构与Sencha推荐的结构不完全匹配。在我们的结构中，我们没有一个app.js，但是我们确实有一个js，其中我们提到了autoload和启动函数，例如下面的文件夹结构。

我们正在寻找的是缩小管理文件夹中的所有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文件中定义包，并说明哪个文件或文件夹属于哪个包。包实际上是一堆JS文件，它们被缩小到另一个单独的JS文件中，可以在servlet/JSP文件中单独请求。此外，您还可以定义包之间的依赖关系(在默认情况下是独立的)，这样当您包含一个包时，其他包就会自动包含在您的页面中。要包含一个包，您可以在servlet中使用特殊标记<jwr>。此外，您还可以启用调试模式，以便在开发时可以调试代码。

工作原理:将servlet添加到web.xml文件中，以便在启动时加载，这也是生成这些包的阶段(对您是透明的)。

一些小贴士：

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

Answer 3

我强烈建议使用grunt_sencha_dependencies插件来查看grunt。这是一个教程。

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

编辑:我已经处理过Sencha CMD，这太糟糕了。我不希望我的最坏的敌人。咕噜声就容易多了。