Minifying ExtJs application

[apogee]

Hi,
We have an extjs application where the structure we laid out doesn't exactly match the structure Sencha recommends. In our structure we don't have an app.js but we do have a js where we mention the autoload and launch function, example as below along with the folder structure.

What we are looking is to minify all the JS files in admin folder and create one JS to be used, we tried looking at the Sencha CMD but of no luck. Can some one please point us for the exact steps for minifying our application for production use.

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'
        });
    }
});

Folder Structure of our application is.
ExtJs_Structure.png

Thanks in advance and let us know if you need more information.

The current ext version we are using is 4.0.7 and we started migrating to 4.2.1.

Thanks

[scottmartin]

we tried looking at the Sencha CMD but of no luck

Can you elaborate?

The most painless way would be to use Cmd and generate a new app with the same namespace.
Then copy all of your code over to the app DIR and run and few commands and your are done.

btw, apogee .. reminds me of the Commander Keen days <bg>

[scottmartin]

The current ext version we are using is 4.0.7 and we started migrating to 4.2.1.

This is most likely the reason. You will need to use 4.2.1 (4.1.2a minimum) to support Cmd

[apogee]

[QUOTE=scottmartin;1035142]Can you elaborate?

Upgraded our application to work with 4.2.1, but using our structure and tried Cmd

[scottmartin]

For Cmd to work, it has to create the meta files then you copy over the files.

// read in all your classes from copied app files
sencha app refresh
// build app; compress
sencha app build

I would need to know the steps you have taken and where it has failed to help.

[apogee]

The first thing I tried to do was generating JSB3 file, I know its deprecated in 4.2.1 but with the structure we have I felt that was the only option.
I tried the below command, but no jsb3 file got generated

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

Thanks

[scottmartin]

That is not going to work. You would need to generate a new app, then copy over your code to app DIR, then refresh

sencha -sdk /path/to/SDK generate app MyApp /path/to/myapp

[apogee]

Thanks scott, I will try creating new app and copying my code.
Another thing with my folder structure is that we have multiple apps, and in most cases we try to use the js from other app folders.
For example in the below image we have utilities and admin apps, from utilities app we use SourceStore and the autoloader is defined as below to access the required

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

In this case how does the Cmd work ? does it copy the required js into the minified version ?




ExtJs_folderstructure_multipleapps.png

Thanks

[scottmartin]

In this case, you would generate a workspace, then generate each app under:
http://docs.sencha.com/extjs/4.2.2/#...mand_workspace