1. #1
    Sencha User
    Join Date
    Nov 2011
    Location
    Dallas, TX
    Posts
    7
    Vote Rating
    1
    apogee is on a distinguished road

      0  

    Default Answered: Minifying ExtJs application

    Answered: Minifying ExtJs application


    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.

    Code:
    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

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

  3. #2
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    8,884
    Answers
    653
    Vote Rating
    440
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    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>

  4. #3
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    8,884
    Answers
    653
    Vote Rating
    440
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    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

  5. #4
    Sencha User
    Join Date
    Nov 2011
    Location
    Dallas, TX
    Posts
    7
    Vote Rating
    1
    apogee is on a distinguished road

      0  

    Default


    [QUOTE=scottmartin;1035142]Can you elaborate?

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

  6. #5
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    8,884
    Answers
    653
    Vote Rating
    440
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


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

    Code:
    // 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.

  7. #6
    Sencha User
    Join Date
    Nov 2011
    Location
    Dallas, TX
    Posts
    7
    Vote Rating
    1
    apogee is on a distinguished road

      0  

    Default


    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
    Code:
    sencha build admin.jsb3 <path to the admin js folder>


    Thanks

  8. #7
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    8,884
    Answers
    653
    Vote Rating
    440
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


    That is not going to work. You would need to generate a new app, then copy over your code to app DIR, then refresh
    Code:
    sencha -sdk /path/to/SDK generate app MyApp /path/to/myapp

  9. #8
    Sencha User
    Join Date
    Nov 2011
    Location
    Dallas, TX
    Posts
    7
    Vote Rating
    1
    apogee is on a distinguished road

      0  

    Default


    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

    Code:
    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

  10. #9
    Sencha - Support Team scottmartin's Avatar
    Join Date
    Jul 2010
    Location
    Houston, Tx
    Posts
    8,884
    Answers
    653
    Vote Rating
    440
    scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future scottmartin has a brilliant future

      0  

    Default


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

Thread Participants: 1

Tags for this Thread