Results 1 to 10 of 10

Thread: Proper way to bundle an Ext JS 4 App?

  1. #1
    Sencha User daubman's Avatar
    Join Date
    Jul 2010
    Location
    Massachusetts
    Posts
    34
    Answers
    1
    Vote Rating
    2
      0  

    Question Answered: Proper way to bundle an Ext JS 4 App?

    I saw the recently announced SenchaSDKTools-2.0.0-Beta. All of the documentation for it so far is very iOS App Store specific. If I just want to bundle the ext classes for my _web_ (not iOS) app, should I be using the SenchaSDKTools-2.0.0-Beta or the older SDK Tools?
    Last edited by daubman; 10 Nov 2011 at 1:36 PM. Reason: clarified that I am targeting web and not iOS

  2. All,

    Please note that you DO NOT have to hand-craft the require statements in order to create the jsb3 file with the SDK. I'm not sure what changed, but the SDK finally started working for me WITHOUT specifying any require statements (fully using the dynamic loading).

    Here is my designer.html:
    Code:
    <!DOCTYPE html><!-- Auto Generated with Ext Designer -->
    <!-- Modifications to this file will be overwritten. -->
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>LaunchEventWindow.xds</title>
    <link rel="stylesheet" type="text/css" href="resources/css/ext-all.css" />
    <script type="text/javascript" src="extjs/ext-debug.js"></script>
    <script type="text/javascript" src="designer.js"></script>
    </head>
    <body></body>
    </html>
    Here is my designer.js:
    Code:
    /*
     * File: designer.js
     * Date: Mon Nov 21 2011 12:54:22 GMT-0500 (EST)
     *
     * This file was generated by Ext Designer version 1.2.2.
     * http://www.sencha.com/products/designer/
     *
     * This file will be auto-generated each and everytime you export.
     *
     * Do NOT hand edit this file.
     */
    
    Ext.Loader.setConfig({
        enabled: true
    });
    
    Ext.application({
        name: 'LaunchEventWindow',
    
        stores: [
            'lewStore'
        ],
    
        launch: function() {
            Ext.QuickTips.init();
    
            var cmp1 = Ext.create('LaunchEventWindow.view.MyViewport', {
                renderTo: Ext.getBody()
            });
            cmp1.show();
        }
    });
    Here is the output from 'sencha create jsb':
    Code:
    % sencha create jsb -a http://127.0.0.1:8080/LaunchEventWindow/designer-local.html -p lew.jsb3
    % cat lew.jsb3 
    {
        "projectName": "Project Name",
        "licenseText": "Copyright(c) 2011 Company Name",
        "builds": [
            {
                "name": "All Classes",
                "target": "all-classes.js",
                "options": {
                    "debug": true
                },
                "files": [
                    {
                        "path": "extjs/src/data/",
                        "name": "Association.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "IdGenerator.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Observable.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "validations.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "HashMap.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Filter.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "Connection.js"
                    },
                    {
                        "path": "extjs/src/data/writer/",
                        "name": "Writer.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "ResultSet.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Memento.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Sorter.js"
                    },
                    {
                        "path": "extjs/src/fx/",
                        "name": "CubicBezier.js"
                    },
                    {
                        "path": "extjs/src/panel/",
                        "name": "Proxy.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "Template.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "Operation.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "KeyMap.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "ZIndexManager.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "ComponentQuery.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "KeyNav.js"
                    },
                    {
                        "path": "extjs/src/fx/target/",
                        "name": "Target.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Floating.js"
                    },
                    {
                        "path": "extjs/src/draw/",
                        "name": "Color.js"
                    },
                    {
                        "path": "extjs/src/dd/",
                        "name": "StatusProxy.js"
                    },
                    {
                        "path": "extjs/src/layout/",
                        "name": "Layout.js"
                    },
                    {
                        "path": "extjs/src/layout/container/boxOverflow/",
                        "name": "None.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Offset.js"
                    },
                    {
                        "path": "extjs/src/fx/",
                        "name": "Queue.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "AbstractContainer.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "SortTypes.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "TextMetrics.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "ClickRepeater.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Animate.js"
                    },
                    {
                        "path": "extjs/src/state/",
                        "name": "Provider.js"
                    },
                    {
                        "path": "extjs/src/app/",
                        "name": "EventBus.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "AbstractManager.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "ModelManager.js"
                    },
                    {
                        "path": "extjs/src/app/",
                        "name": "Controller.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "AbstractMixedCollection.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "ComponentManager.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "Types.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "Field.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "Ajax.js"
                    },
                    {
                        "path": "extjs/src/data/writer/",
                        "name": "Json.js"
                    },
                    {
                        "path": "extjs/src/data/reader/",
                        "name": "Reader.js"
                    },
                    {
                        "path": "extjs/src/data/reader/",
                        "name": "Json.js"
                    },
                    {
                        "path": "extjs/src/data/proxy/",
                        "name": "Proxy.js"
                    },
                    {
                        "path": "extjs/src/data/proxy/",
                        "name": "Server.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Sortable.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "MixedCollection.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "StoreManager.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "Errors.js"
                    },
                    {
                        "path": "extjs/src/data/proxy/",
                        "name": "Ajax.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "Model.js"
                    },
                    {
                        "path": "extjs/src/fx/",
                        "name": "Easing.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "XTemplate.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "FocusManager.js"
                    },
                    {
                        "path": "extjs/src/fx/target/",
                        "name": "Sprite.js"
                    },
                    {
                        "path": "extjs/src/fx/target/",
                        "name": "Element.js"
                    },
                    {
                        "path": "extjs/src/fx/target/",
                        "name": "CompositeElement.js"
                    },
                    {
                        "path": "extjs/src/fx/target/",
                        "name": "CompositeSprite.js"
                    },
                    {
                        "path": "extjs/src/fx/target/",
                        "name": "Component.js"
                    },
                    {
                        "path": "extjs/src/fx/",
                        "name": "Manager.js"
                    },
                    {
                        "path": "extjs/src/fx/",
                        "name": "Animator.js"
                    },
                    {
                        "path": "extjs/src/draw/",
                        "name": "Draw.js"
                    },
                    {
                        "path": "extjs/src/fx/",
                        "name": "PropertyHandler.js"
                    },
                    {
                        "path": "extjs/src/fx/",
                        "name": "Anim.js"
                    },
                    {
                        "path": "extjs/src/layout/component/",
                        "name": "Component.js"
                    },
                    {
                        "path": "extjs/src/layout/component/",
                        "name": "AbstractDock.js"
                    },
                    {
                        "path": "extjs/src/layout/component/",
                        "name": "Dock.js"
                    },
                    {
                        "path": "extjs/src/layout/component/",
                        "name": "Tip.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Region.js"
                    },
                    {
                        "path": "extjs/src/dd/",
                        "name": "DragDropManager.js"
                    },
                    {
                        "path": "extjs/src/layout/container/boxOverflow/",
                        "name": "Scroller.js"
                    },
                    {
                        "path": "extjs/src/dd/",
                        "name": "DragDrop.js"
                    },
                    {
                        "path": "extjs/src/dd/",
                        "name": "DD.js"
                    },
                    {
                        "path": "extjs/src/dd/",
                        "name": "DDProxy.js"
                    },
                    {
                        "path": "extjs/src/dd/",
                        "name": "DragSource.js"
                    },
                    {
                        "path": "extjs/src/panel/",
                        "name": "DD.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "Container.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "Auto.js"
                    },
                    {
                        "path": "extjs/src/menu/",
                        "name": "Manager.js"
                    },
                    {
                        "path": "extjs/src/layout/component/",
                        "name": "Button.js"
                    },
                    {
                        "path": "extjs/src/state/",
                        "name": "Manager.js"
                    },
                    {
                        "path": "extjs/src/state/",
                        "name": "Stateful.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "AbstractComponent.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "Component.js"
                    },
                    {
                        "path": "extjs/src/container/",
                        "name": "AbstractContainer.js"
                    },
                    {
                        "path": "extjs/src/container/",
                        "name": "Container.js"
                    },
                    {
                        "path": "extjs/src/panel/",
                        "name": "Header.js"
                    },
                    {
                        "path": "extjs/src/toolbar/",
                        "name": "Fill.js"
                    },
                    {
                        "path": "extjs/src/button/",
                        "name": "Button.js"
                    },
                    {
                        "path": "extjs/src/toolbar/",
                        "name": "Item.js"
                    },
                    {
                        "path": "extjs/src/toolbar/",
                        "name": "Separator.js"
                    },
                    {
                        "path": "extjs/src/layout/container/boxOverflow/",
                        "name": "Menu.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "Box.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "VBox.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "HBox.js"
                    },
                    {
                        "path": "extjs/src/toolbar/",
                        "name": "Toolbar.js"
                    },
                    {
                        "path": "extjs/src/panel/",
                        "name": "AbstractPanel.js"
                    },
                    {
                        "path": "extjs/src/panel/",
                        "name": "Panel.js"
                    },
                    {
                        "path": "extjs/src/tip/",
                        "name": "Tip.js"
                    },
                    {
                        "path": "extjs/src/tip/",
                        "name": "ToolTip.js"
                    },
                    {
                        "path": "extjs/src/tip/",
                        "name": "QuickTip.js"
                    },
                    {
                        "path": "extjs/src/tip/",
                        "name": "QuickTipManager.js"
                    },
                    {
                        "path": "extjs/src/app/",
                        "name": "Application.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "Batch.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Point.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "PluginManager.js"
                    },
                    {
                        "path": "extjs/src/layout/component/",
                        "name": "Auto.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "Request.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "LoadMask.js"
                    },
                    {
                        "path": "extjs/src/resizer/",
                        "name": "Resizer.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "CSS.js"
                    },
                    {
                        "path": "extjs/src/menu/",
                        "name": "Item.js"
                    },
                    {
                        "path": "extjs/src/menu/",
                        "name": "CheckItem.js"
                    },
                    {
                        "path": "extjs/src/menu/",
                        "name": "KeyNav.js"
                    },
                    {
                        "path": "extjs/src/menu/",
                        "name": "Separator.js"
                    },
                    {
                        "path": "extjs/src/dd/",
                        "name": "DragTracker.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "ElementLoader.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "AbstractFit.js"
                    },
                    {
                        "path": "extjs/src/draw/",
                        "name": "CompositeSprite.js"
                    },
                    {
                        "path": "extjs/src/layout/component/",
                        "name": "Draw.js"
                    },
                    {
                        "path": "extjs/src/panel/",
                        "name": "Tool.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "Layer.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Grouper.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "AbstractStore.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "ComponentDragger.js"
                    },
                    {
                        "path": "extjs/src/window/",
                        "name": "Window.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "Fit.js"
                    },
                    {
                        "path": "extjs/src/menu/",
                        "name": "Menu.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "ComponentLoader.js"
                    },
                    {
                        "path": "extjs/src/draw/",
                        "name": "Surface.js"
                    },
                    {
                        "path": "extjs/src/draw/",
                        "name": "Component.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "Store.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "ArrayStore.js"
                    },
                    {
                        "path": "extjs/src/resizer/",
                        "name": "ResizeTracker.js"
                    },
                    {
                        "path": "extjs/src/draw/",
                        "name": "Matrix.js"
                    },
                    {
                        "path": "extjs/src/data/proxy/",
                        "name": "Client.js"
                    },
                    {
                        "path": "extjs/src/data/reader/",
                        "name": "Array.js"
                    },
                    {
                        "path": "extjs/src/draw/",
                        "name": "SpriteDD.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "ShadowPool.js"
                    },
                    {
                        "path": "extjs/src/data/proxy/",
                        "name": "Memory.js"
                    },
                    {
                        "path": "extjs/src/draw/",
                        "name": "Sprite.js"
                    },
                    {
                        "path": "extjs/src/draw/engine/",
                        "name": "Vml.js"
                    },
                    {
                        "path": "extjs/src/draw/engine/",
                        "name": "Svg.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "Shadow.js"
                    },
                    {
                        "path": "app/store/",
                        "name": "lewStore.js"
                    }
                ]
            },
            {
                "name": "Application - Production",
                "target": "app-all.js",
                "compress": true,
                "files": [
                    {
                        "path": "",
                        "name": "all-classes.js"
                    },
                    {
                        "path": "",
                        "name": "app.js"
                    }
                ]
            }
        ],
        "resources": []
    }
    I'm still a little confused as to why it didn't include the MyViewport.js files from view/ or view/ui/, but this is a lot of progress.

    Just wanted to provide some working examples of code that plays nicely with the SDK tools. Hope this helps somebody else.

    Thanks all!
    Aaron

  3. #2
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,336
    Answers
    3885
    Vote Rating
    1296
      0  

    Default

    The SDK tools are still able to build your app
    Mitchell Simoens @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it!

    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  4. #3
    Sencha User daubman's Avatar
    Join Date
    Jul 2010
    Location
    Massachusetts
    Posts
    34
    Answers
    1
    Vote Rating
    2
      0  

    Question Is there some configuration that needs to be done, then - it does not work for me?

    Here's what I get when running on OS 10.7.2 (64-bit Java is default - is that a problem? are there any docs on how to USE the SDK tools correctly?):

    Code:
    % sencha create jsb -a http://127.0.0.1:8080/LaunchEventWindow/designer.html -p lew.jsb3% cat lew.jsb3 
    {
        "projectName": "Project Name",
        "licenseText": "Copyright(c) 2011 Company Name",
        "builds": [
            {
                "name": "All Classes",
                "target": "all-classes.js",
                "options": {
                    "debug": true
                },
                "files": []
            },
            {
                "name": "Application - Production",
                "target": "app-all.js",
                "compress": true,
                "files": [
                    {
                        "path": "",
                        "name": "all-classes.js"
                    },
                    {
                        "path": "",
                        "name": "app.js"
                    }
                ]
            }
        ],
        "resources": []
    }
    This is pointing at the Designer 1.2.2-48 export. I tried with no modifications as well as attempting to replace ext-all-debug.js with ext.js and allowing dynamic loading - both resulted in the above empty/worthless jsb3 file.

    What am I doing wrong? Are the correct steps for running the SDK against a designer-created app documented anywhere? (I wanted to get this part at least to work before adding in custom code, assuming, apparently incorrectly, that the two Sencha tools would play better together.)

  5. #4
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,336
    Answers
    3885
    Vote Rating
    1296
      0  
    Mitchell Simoens @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it!

    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  6. #5
    Sencha User daubman's Avatar
    Join Date
    Jul 2010
    Location
    Massachusetts
    Posts
    34
    Answers
    1
    Vote Rating
    2
      0  

    Question Link does not provide info to determine why sencha create jsb is not working

    mitchellsimoens, the link you posted is what I've been using to determine how to use the SDK tools to attempt to generate the jsb3 file. Unfortunately, it does not address any of my questions (how to troubleshoot why 'sencha create jsb' is essentially generating an empty jsb for me, what a correct setup looks like).

    Moreover, that link really doesn't even provide the minimum information necessary to get started with the SDK tools.

    e.g. sections 2.2 and 2.3 (begin) to describe the different ways you could structure your index.html. Section 3 then does not say which way will work with the SDK tools, nor what config options must be included in your JS for the tools to work as designed.

    Having a full working example would be the first step. Describing what in that example is:
    1. Required for the tools to work
    2. Just best practice
    3. Optional, with description of alternates


    Would go so much further.

    This is the documentation I am looking for (or at least a pointer as to why I may be getting the empty/worthless .jsb3 file).

  7. #6
    Sencha - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,336
    Answers
    3885
    Vote Rating
    1296
      0  

    Default

    Guides are always going to be a work in progress and I do agree. The only think I can think of is did you use the requires/uses throughout your application classes?
    Mitchell Simoens @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it!

    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  8. #7
    Sencha User
    Join Date
    Oct 2011
    Posts
    5
    Vote Rating
    0
      0  

    Default

    I've had an issue with that before myself. Did you make sure you're using "ext-debug.js" instead of "ext-all-debug.js" or any of the ones with "all" in there? Also like mitchellsimoens said, you'll need to put in all your requires before your app for it to grab them and put it together.

  9. #8
    Sencha User daubman's Avatar
    Join Date
    Jul 2010
    Location
    Massachusetts
    Posts
    34
    Answers
    1
    Vote Rating
    2
      0  

    Default

    Mitchell, kn21069;

    Can you point to any documentation that states you must add in all of the 'requires' statements before the create command will work?

    If I have to hand-add all of the requires statements, I can almost as easily hand-create the jsb3 file as well, no?

    I thought one of the benefits of the dynamic loading and create command was to compile all necessary classes that your coded needed without you having to KNOW a priori what all of the classes were?

    Then, instead of having to add-by-hand all of the required classes, you can just include the custom-generated include file created from the jsb3 for your app?

    Thanks again,
    Aaron

  10. #9
    Sencha User
    Join Date
    Oct 2011
    Posts
    5
    Vote Rating
    0
      0  

    Default

    I know it's a bit tough to look around for information on Ext JS 4. The API docs definitely feel intimidating sometimes but it's the best thing you have. When looking this issue up I decided to check under Ext.loader, since it's a question pertaining to it. Here I found some basic information on deployment.

    http://docs.sencha.com/ext-js/4-0/#!/api/Ext.Loader

    Deployment

    It's important to note that dynamic loading should only be used during development on your local machines. During production, all dependencies should be combined into one single JavaScript file. Ext.Loader makes the whole process of transitioning from / to between development / maintenance and production as easy as possible. Internally Ext.Loader.history maintains the list of all dependencies your application needs in the exact loading sequence. It's as simple as concatenating all files in this array into one, then include it on top of your application.This process will be automated with Sencha Command, to be released and documented towards Ext JS 4 Final.
    I originally thought that it should dynamically load what you need for your app as well, but that is currently only available for development when using the loader or ext-all/ext-all-debug/etc. For now, when you are trying to deploy a bundled Ext JS 4 app you must include the required dependencies in order for it to bundle together. Also, you may create the jsb3 from hand but I wouldn't recommend it unless you want to spend quite a bit of time on it, it's definitely much easier to just add the required dependencies into your main app.js.

    If you don't know how to find those dependencies you can look them up in several different places, here's a couple quick areas to look it up.

    Firefox Firebug:
    http://i40.tinypic.com/5o6paw.jpg

    Chrome Developer Tools:
    http://i41.tinypic.com/9a0kkw.jpg

    Oddly enough, when I tried to get the dependencies through console on Chrome as shown in the getting started guide it didn't show anything for me.

    Also if you don't want to manually add every single dependency into your require, you can instead add all the files from that folder. Say you have several Ext.form.field dependencies, instead of adding each and every one, you can instead just add in Ext.form.field.* to grab all the files in there.

    For example:
    Code:
    Ext.require([
        'Ext.chart.*',
        'Ext.container.Viewport',
        'Ext.data.Store',
        'Ext.form.Basic',
        'Ext.form.FieldAncestor',
        'Ext.form.Labelable',
        'Ext.form.Panel',
        'Ext.form.action.Load',
        'Ext.form.action.Action',
        'Ext.form.action.Submit',
        'Ext.form.field.Text',
        'Ext.form.field.Base',
        'Ext.form.field.Field',
        'Ext.form.field.Number',
        'Ext.form.field.Spinner',
        'Ext.form.field.VTypes',
        'Ext.form.field.ComboBox',
        'Ext.form.field.Picker',
        'Ext.form.field.Trigger',
        'Ext.layout.container.Anchor',
        'Ext.layout.container.Card',
        'Ext.layout.container.AbstractCard',
        'Ext.layout.container.Border',
        'Ext.layout.component.Tab',
        'Ext.layout.component.field.Field',
        'Ext.layout.component.field.Text',
        'Ext.layout.component.ProgressBar',
        'Ext.layout.component.field.Trigger',
        'Ext.layout.component.BoundList',
        'Ext.ProgressBar',
        'Ext.resizer.Splitter',
        'Ext.resizer.SplitterTracker',
        'Ext.tab.Panel',
        'Ext.tab.Bar',
        'Ext.tab.Tab',
        'Ext.toolbar.Paging',
        'Ext.toolbar.TextItem',
        'Ext.view.BoundList',
        'Ext.view.BoundListKeyNav',
        'Ext.window.MessageBox'
    ]);
    Can be shorten to this:
    Code:
    Ext.require([
        'Ext.chart.*',
        'Ext.container.Viewport',
        'Ext.data.Store',
        'Ext.form.*',
        'Ext.form.action.*',
        'Ext.form.field.*',
        'Ext.layout.container.*',
        'Ext.layout.component.*',
        'Ext.ProgressBar',
        'Ext.resizer.Splitter',
        'Ext.resizer.SplitterTracker',
        'Ext.tab.*',
        'Ext.toolbar.*',
        'Ext.view.*',
        'Ext.window.MessageBox'
    ]);
    Personally I'd just add all of them separately in order to get the smallest file I can, but if you just want a fast bundle or are just lazy you can do that.

    Here's an example of one of my random app.jsb3 files in case you want to do it that way.

    Code:
    {
        "projectName": "Project Name",
        "licenseText": "Copyright(c) 2011 Company Name",
        "builds": [
            {
                "name": "All Classes",
                "target": "all-classes.js",
                "options": {
                    "debug": true
                },
                "files": [
                    {
                        "path": "extjs/src/chart/",
                        "name": "Callout.js"
                    },
                    {
                        "path": "extjs/src/chart/",
                        "name": "Mask.js"
                    },
                    {
                        "path": "extjs/src/chart/",
                        "name": "Navigation.js"
                    },
                    {
                        "path": "extjs/src/chart/",
                        "name": "Shape.js"
                    },
                    {
                        "path": "extjs/src/form/",
                        "name": "FieldAncestor.js"
                    },
                    {
                        "path": "extjs/src/form/action/",
                        "name": "Action.js"
                    },
                    {
                        "path": "extjs/src/form/action/",
                        "name": "Submit.js"
                    },
                    {
                        "path": "extjs/src/form/field/",
                        "name": "Field.js"
                    },
                    {
                        "path": "extjs/src/form/action/",
                        "name": "StandardSubmit.js"
                    },
                    {
                        "path": "extjs/src/form/field/",
                        "name": "VTypes.js"
                    },
                    {
                        "path": "extjs/src/layout/container/boxOverflow/",
                        "name": "None.js"
                    },
                    {
                        "path": "extjs/src/draw/",
                        "name": "Color.js"
                    },
                    {
                        "path": "extjs/src/draw/",
                        "name": "Draw.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Observable.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "Connection.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "ClickRepeater.js"
                    },
                    {
                        "path": "extjs/src/layout/",
                        "name": "Layout.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "TextMetrics.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "Template.js"
                    },
                    {
                        "path": "extjs/src/dd/",
                        "name": "DragTracker.js"
                    },
                    {
                        "path": "extjs/src/app/",
                        "name": "Controller.js"
                    },
                    {
                        "path": "extjs/src/app/",
                        "name": "EventBus.js"
                    },
                    {
                        "path": "extjs/src/fx/",
                        "name": "CubicBezier.js"
                    },
                    {
                        "path": "extjs/src/fx/",
                        "name": "PropertyHandler.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Animate.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Filter.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Floating.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "Operation.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "Association.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Sorter.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "validations.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "KeyMap.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Memento.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Offset.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "HashMap.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "ComponentQuery.js"
                    },
                    {
                        "path": "extjs/src/dd/",
                        "name": "Registry.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "ComponentDragger.js"
                    },
                    {
                        "path": "extjs/src/fx/",
                        "name": "Queue.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "Ajax.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "ZIndexManager.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "SortTypes.js"
                    },
                    {
                        "path": "extjs/src/panel/",
                        "name": "Proxy.js"
                    },
                    {
                        "path": "extjs/src/dd/",
                        "name": "StatusProxy.js"
                    },
                    {
                        "path": "extjs/src/fx/target/",
                        "name": "Target.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "ElementLoader.js"
                    },
                    {
                        "path": "extjs/src/state/",
                        "name": "Provider.js"
                    },
                    {
                        "path": "extjs/src/data/writer/",
                        "name": "Writer.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "ResultSet.js"
                    },
                    {
                        "path": "extjs/src/chart/",
                        "name": "Label.js"
                    },
                    {
                        "path": "extjs/src/chart/theme/",
                        "name": "Theme.js"
                    },
                    {
                        "path": "extjs/src/chart/theme/",
                        "name": "Base.js"
                    },
                    {
                        "path": "extjs/src/form/action/",
                        "name": "Load.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "AbstractContainer.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "Container.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "AbstractFit.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "Auto.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "Anchor.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "Fit.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "AbstractCard.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "Card.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "Column.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "CheckboxGroup.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "Table.js"
                    },
                    {
                        "path": "extjs/src/layout/component/",
                        "name": "Component.js"
                    },
                    {
                        "path": "extjs/src/layout/component/",
                        "name": "Auto.js"
                    },
                    {
                        "path": "extjs/src/layout/container/boxOverflow/",
                        "name": "Scroller.js"
                    },
                    {
                        "path": "extjs/src/layout/component/",
                        "name": "AbstractDock.js"
                    },
                    {
                        "path": "extjs/src/layout/component/",
                        "name": "Draw.js"
                    },
                    {
                        "path": "extjs/src/layout/component/",
                        "name": "BoundList.js"
                    },
                    {
                        "path": "extjs/src/layout/component/",
                        "name": "Button.js"
                    },
                    {
                        "path": "extjs/src/layout/component/",
                        "name": "Dock.js"
                    },
                    {
                        "path": "extjs/src/layout/component/",
                        "name": "ProgressBar.js"
                    },
                    {
                        "path": "extjs/src/layout/component/",
                        "name": "Tab.js"
                    },
                    {
                        "path": "extjs/src/layout/component/",
                        "name": "Tip.js"
                    },
                    {
                        "path": "extjs/src/layout/component/",
                        "name": "Body.js"
                    },
                    {
                        "path": "extjs/src/layout/component/",
                        "name": "FieldSet.js"
                    },
                    {
                        "path": "extjs/src/layout/component/field/",
                        "name": "Field.js"
                    },
                    {
                        "path": "extjs/src/layout/component/field/",
                        "name": "Text.js"
                    },
                    {
                        "path": "extjs/src/layout/component/field/",
                        "name": "TextArea.js"
                    },
                    {
                        "path": "extjs/src/layout/component/field/",
                        "name": "Trigger.js"
                    },
                    {
                        "path": "extjs/src/layout/component/",
                        "name": "Editor.js"
                    },
                    {
                        "path": "extjs/src/layout/component/field/",
                        "name": "File.js"
                    },
                    {
                        "path": "extjs/src/layout/component/field/",
                        "name": "HtmlEditor.js"
                    },
                    {
                        "path": "extjs/src/layout/component/field/",
                        "name": "Slider.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Grouper.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "XTemplate.js"
                    },
                    {
                        "path": "extjs/src/form/",
                        "name": "Labelable.js"
                    },
                    {
                        "path": "extjs/src/view/",
                        "name": "TableChunker.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "KeyNav.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Region.js"
                    },
                    {
                        "path": "extjs/src/resizer/",
                        "name": "SplitterTracker.js"
                    },
                    {
                        "path": "extjs/src/dd/",
                        "name": "DragDropManager.js"
                    },
                    {
                        "path": "extjs/src/fx/",
                        "name": "Easing.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "AbstractMixedCollection.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Sortable.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "MixedCollection.js"
                    },
                    {
                        "path": "extjs/src/form/",
                        "name": "CheckboxManager.js"
                    },
                    {
                        "path": "extjs/src/form/",
                        "name": "RadioManager.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "StoreManager.js"
                    },
                    {
                        "path": "extjs/src/draw/",
                        "name": "CompositeSprite.js"
                    },
                    {
                        "path": "extjs/src/chart/",
                        "name": "LegendItem.js"
                    },
                    {
                        "path": "extjs/src/chart/",
                        "name": "Legend.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "Errors.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "AbstractStore.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "LoadMask.js"
                    },
                    {
                        "path": "extjs/src/draw/",
                        "name": "Surface.js"
                    },
                    {
                        "path": "extjs/src/direct/",
                        "name": "Manager.js"
                    },
                    {
                        "path": "extjs/src/form/action/",
                        "name": "DirectLoad.js"
                    },
                    {
                        "path": "extjs/src/form/action/",
                        "name": "DirectSubmit.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "AbstractManager.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "ModelManager.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "ComponentManager.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "FocusManager.js"
                    },
                    {
                        "path": "extjs/src/menu/",
                        "name": "Manager.js"
                    },
                    {
                        "path": "extjs/src/selection/",
                        "name": "Model.js"
                    },
                    {
                        "path": "extjs/src/selection/",
                        "name": "DataViewModel.js"
                    },
                    {
                        "path": "extjs/src/fx/target/",
                        "name": "Element.js"
                    },
                    {
                        "path": "extjs/src/fx/target/",
                        "name": "Sprite.js"
                    },
                    {
                        "path": "extjs/src/fx/target/",
                        "name": "CompositeElement.js"
                    },
                    {
                        "path": "extjs/src/fx/target/",
                        "name": "CompositeSprite.js"
                    },
                    {
                        "path": "extjs/src/fx/target/",
                        "name": "Component.js"
                    },
                    {
                        "path": "extjs/src/fx/",
                        "name": "Manager.js"
                    },
                    {
                        "path": "extjs/src/fx/",
                        "name": "Animator.js"
                    },
                    {
                        "path": "extjs/src/fx/",
                        "name": "Anim.js"
                    },
                    {
                        "path": "extjs/src/chart/",
                        "name": "Highlight.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "Types.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "Field.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "PluginManager.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "ComponentLoader.js"
                    },
                    {
                        "path": "extjs/src/dd/",
                        "name": "ScrollManager.js"
                    },
                    {
                        "path": "extjs/src/state/",
                        "name": "Manager.js"
                    },
                    {
                        "path": "extjs/src/state/",
                        "name": "Stateful.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "AbstractComponent.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "Component.js"
                    },
                    {
                        "path": "extjs/src/chart/",
                        "name": "MaskLayer.js"
                    },
                    {
                        "path": "extjs/src/form/",
                        "name": "Label.js"
                    },
                    {
                        "path": "extjs/src/form/field/",
                        "name": "Base.js"
                    },
                    {
                        "path": "extjs/src/form/field/",
                        "name": "Display.js"
                    },
                    {
                        "path": "extjs/src/form/field/",
                        "name": "Hidden.js"
                    },
                    {
                        "path": "extjs/src/form/field/",
                        "name": "Text.js"
                    },
                    {
                        "path": "extjs/src/form/field/",
                        "name": "Checkbox.js"
                    },
                    {
                        "path": "extjs/src/form/field/",
                        "name": "Radio.js"
                    },
                    {
                        "path": "extjs/src/form/field/",
                        "name": "TextArea.js"
                    },
                    {
                        "path": "extjs/src/form/field/",
                        "name": "Trigger.js"
                    },
                    {
                        "path": "extjs/src/form/field/",
                        "name": "Picker.js"
                    },
                    {
                        "path": "extjs/src/form/field/",
                        "name": "Spinner.js"
                    },
                    {
                        "path": "extjs/src/form/field/",
                        "name": "Number.js"
                    },
                    {
                        "path": "extjs/src/form/field/",
                        "name": "File.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "ProgressBar.js"
                    },
                    {
                        "path": "extjs/src/resizer/",
                        "name": "Splitter.js"
                    },
                    {
                        "path": "extjs/src/toolbar/",
                        "name": "Item.js"
                    },
                    {
                        "path": "extjs/src/toolbar/",
                        "name": "Fill.js"
                    },
                    {
                        "path": "extjs/src/toolbar/",
                        "name": "Separator.js"
                    },
                    {
                        "path": "extjs/src/toolbar/",
                        "name": "Spacer.js"
                    },
                    {
                        "path": "extjs/src/toolbar/",
                        "name": "TextItem.js"
                    },
                    {
                        "path": "extjs/src/view/",
                        "name": "AbstractView.js"
                    },
                    {
                        "path": "extjs/src/view/",
                        "name": "View.js"
                    },
                    {
                        "path": "extjs/src/view/",
                        "name": "Table.js"
                    },
                    {
                        "path": "extjs/src/draw/",
                        "name": "Component.js"
                    },
                    {
                        "path": "extjs/src/chart/",
                        "name": "Chart.js"
                    },
                    {
                        "path": "extjs/src/chart/",
                        "name": "TipSurface.js"
                    },
                    {
                        "path": "extjs/src/chart/axis/",
                        "name": "Abstract.js"
                    },
                    {
                        "path": "extjs/src/chart/axis/",
                        "name": "Axis.js"
                    },
                    {
                        "path": "extjs/src/chart/axis/",
                        "name": "Category.js"
                    },
                    {
                        "path": "extjs/src/chart/axis/",
                        "name": "Gauge.js"
                    },
                    {
                        "path": "extjs/src/chart/axis/",
                        "name": "Numeric.js"
                    },
                    {
                        "path": "extjs/src/chart/axis/",
                        "name": "Radial.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "Absolute.js"
                    },
                    {
                        "path": "extjs/src/button/",
                        "name": "Button.js"
                    },
                    {
                        "path": "extjs/src/layout/container/boxOverflow/",
                        "name": "Menu.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "Box.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "HBox.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "VBox.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "Accordion.js"
                    },
                    {
                        "path": "extjs/src/tab/",
                        "name": "Tab.js"
                    },
                    {
                        "path": "extjs/src/picker/",
                        "name": "Color.js"
                    },
                    {
                        "path": "extjs/src/container/",
                        "name": "AbstractContainer.js"
                    },
                    {
                        "path": "extjs/src/container/",
                        "name": "Container.js"
                    },
                    {
                        "path": "extjs/src/container/",
                        "name": "Viewport.js"
                    },
                    {
                        "path": "extjs/src/form/",
                        "name": "FieldContainer.js"
                    },
                    {
                        "path": "extjs/src/form/",
                        "name": "CheckboxGroup.js"
                    },
                    {
                        "path": "extjs/src/form/",
                        "name": "RadioGroup.js"
                    },
                    {
                        "path": "extjs/src/form/",
                        "name": "FieldSet.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "Border.js"
                    },
                    {
                        "path": "extjs/src/toolbar/",
                        "name": "Toolbar.js"
                    },
                    {
                        "path": "extjs/src/toolbar/",
                        "name": "Paging.js"
                    },
                    {
                        "path": "extjs/src/view/",
                        "name": "BoundList.js"
                    },
                    {
                        "path": "extjs/src/view/",
                        "name": "BoundListKeyNav.js"
                    },
                    {
                        "path": "extjs/src/form/field/",
                        "name": "ComboBox.js"
                    },
                    {
                        "path": "extjs/src/panel/",
                        "name": "Header.js"
                    },
                    {
                        "path": "extjs/src/tab/",
                        "name": "Bar.js"
                    },
                    {
                        "path": "extjs/src/panel/",
                        "name": "AbstractPanel.js"
                    },
                    {
                        "path": "extjs/src/picker/",
                        "name": "Month.js"
                    },
                    {
                        "path": "extjs/src/button/",
                        "name": "Split.js"
                    },
                    {
                        "path": "extjs/src/picker/",
                        "name": "Date.js"
                    },
                    {
                        "path": "extjs/src/form/field/",
                        "name": "Date.js"
                    },
                    {
                        "path": "extjs/src/data/writer/",
                        "name": "Json.js"
                    },
                    {
                        "path": "extjs/src/dd/",
                        "name": "DragDrop.js"
                    },
                    {
                        "path": "extjs/src/dd/",
                        "name": "DDTarget.js"
                    },
                    {
                        "path": "extjs/src/dd/",
                        "name": "DropTarget.js"
                    },
                    {
                        "path": "extjs/src/dd/",
                        "name": "DropZone.js"
                    },
                    {
                        "path": "extjs/src/view/",
                        "name": "DropZone.js"
                    },
                    {
                        "path": "extjs/src/dd/",
                        "name": "DD.js"
                    },
                    {
                        "path": "extjs/src/dd/",
                        "name": "DDProxy.js"
                    },
                    {
                        "path": "extjs/src/dd/",
                        "name": "DragSource.js"
                    },
                    {
                        "path": "extjs/src/dd/",
                        "name": "DragZone.js"
                    },
                    {
                        "path": "extjs/src/view/",
                        "name": "DragZone.js"
                    },
                    {
                        "path": "extjs/src/panel/",
                        "name": "DD.js"
                    },
                    {
                        "path": "extjs/src/panel/",
                        "name": "Panel.js"
                    },
                    {
                        "path": "extjs/src/tab/",
                        "name": "Panel.js"
                    },
                    {
                        "path": "extjs/src/window/",
                        "name": "Window.js"
                    },
                    {
                        "path": "extjs/src/window/",
                        "name": "MessageBox.js"
                    },
                    {
                        "path": "extjs/src/form/",
                        "name": "Basic.js"
                    },
                    {
                        "path": "extjs/src/form/",
                        "name": "Panel.js"
                    },
                    {
                        "path": "extjs/src/tip/",
                        "name": "Tip.js"
                    },
                    {
                        "path": "extjs/src/tip/",
                        "name": "ToolTip.js"
                    },
                    {
                        "path": "extjs/src/chart/",
                        "name": "Tip.js"
                    },
                    {
                        "path": "extjs/src/chart/series/",
                        "name": "Series.js"
                    },
                    {
                        "path": "extjs/src/chart/series/",
                        "name": "Cartesian.js"
                    },
                    {
                        "path": "extjs/src/chart/series/",
                        "name": "Area.js"
                    },
                    {
                        "path": "extjs/src/chart/series/",
                        "name": "Bar.js"
                    },
                    {
                        "path": "extjs/src/chart/series/",
                        "name": "Column.js"
                    },
                    {
                        "path": "extjs/src/chart/series/",
                        "name": "Gauge.js"
                    },
                    {
                        "path": "extjs/src/chart/series/",
                        "name": "Radar.js"
                    },
                    {
                        "path": "extjs/src/chart/series/",
                        "name": "Scatter.js"
                    },
                    {
                        "path": "extjs/src/chart/series/",
                        "name": "Pie.js"
                    },
                    {
                        "path": "extjs/src/chart/series/",
                        "name": "Line.js"
                    },
                    {
                        "path": "extjs/src/tip/",
                        "name": "QuickTip.js"
                    },
                    {
                        "path": "extjs/src/tip/",
                        "name": "QuickTipManager.js"
                    },
                    {
                        "path": "extjs/src/form/field/",
                        "name": "HtmlEditor.js"
                    },
                    {
                        "path": "extjs/src/data/reader/",
                        "name": "Reader.js"
                    },
                    {
                        "path": "extjs/src/data/reader/",
                        "name": "Json.js"
                    },
                    {
                        "path": "extjs/src/data/proxy/",
                        "name": "Proxy.js"
                    },
                    {
                        "path": "extjs/src/data/proxy/",
                        "name": "Server.js"
                    },
                    {
                        "path": "extjs/src/data/proxy/",
                        "name": "Ajax.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "Model.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "Store.js"
                    },
                    {
                        "path": "extjs/src/app/",
                        "name": "Application.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "JsonStore.js"
                    },
                    {
                        "path": "extjs/src/chart/axis/",
                        "name": "Time.js"
                    },
                    {
                        "path": "extjs/src/picker/",
                        "name": "Time.js"
                    },
                    {
                        "path": "extjs/src/form/field/",
                        "name": "Time.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "ArrayStore.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "Layer.js"
                    },
                    {
                        "path": "extjs/src/resizer/",
                        "name": "Resizer.js"
                    },
                    {
                        "path": "extjs/src/panel/",
                        "name": "Tool.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Point.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "CSS.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "Request.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "Batch.js"
                    },
                    {
                        "path": "extjs/src/menu/",
                        "name": "Item.js"
                    },
                    {
                        "path": "extjs/src/menu/",
                        "name": "KeyNav.js"
                    },
                    {
                        "path": "extjs/src/menu/",
                        "name": "Separator.js"
                    },
                    {
                        "path": "extjs/src/draw/",
                        "name": "Matrix.js"
                    },
                    {
                        "path": "extjs/src/data/proxy/",
                        "name": "Client.js"
                    },
                    {
                        "path": "extjs/src/draw/",
                        "name": "SpriteDD.js"
                    },
                    {
                        "path": "extjs/src/data/proxy/",
                        "name": "Memory.js"
                    },
                    {
                        "path": "extjs/src/menu/",
                        "name": "CheckItem.js"
                    },
                    {
                        "path": "extjs/src/menu/",
                        "name": "Menu.js"
                    },
                    {
                        "path": "extjs/src/draw/",
                        "name": "Sprite.js"
                    },
                    {
                        "path": "extjs/src/draw/engine/",
                        "name": "Svg.js"
                    },
                    {
                        "path": "extjs/src/draw/engine/",
                        "name": "Vml.js"
                    },
                    {
                        "path": "extjs/src/resizer/",
                        "name": "ResizeTracker.js"
                    },
                    {
                        "path": "extjs/src/data/reader/",
                        "name": "Array.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "ShadowPool.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "Shadow.js"
                    },
                    {
                        "path": "app/store/",
                        "name": "LineStore.js"
                    },
                    {
                        "path": "app/model/",
                        "name": "WeatherPoint.js"
                    },
                    {
                        "path": "app/view/company/",
                        "name": "Details.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "Tree.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "NodeInterface.js"
                    },
                    {
                        "path": "extjs/src/tree/",
                        "name": "View.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "NodeStore.js"
                    },
                    {
                        "path": "extjs/src/panel/",
                        "name": "Table.js"
                    },
                    {
                        "path": "extjs/src/selection/",
                        "name": "RowModel.js"
                    },
                    {
                        "path": "extjs/src/grid/header/",
                        "name": "Container.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "TreeStore.js"
                    },
                    {
                        "path": "app/store/",
                        "name": "TreeList.js"
                    },
                    {
                        "path": "extjs/src/selection/",
                        "name": "TreeModel.js"
                    },
                    {
                        "path": "extjs/src/grid/column/",
                        "name": "Column.js"
                    },
                    {
                        "path": "extjs/src/tree/",
                        "name": "Column.js"
                    },
                    {
                        "path": "extjs/src/tree/",
                        "name": "Panel.js"
                    },
                    {
                        "path": "app/view/company/",
                        "name": "TreePanel.js"
                    },
                    {
                        "path": "app/controller/",
                        "name": "Companies.js"
                    },
                    {
                        "path": "extjs/src/grid/",
                        "name": "ColumnLayout.js"
                    },
                    {
                        "path": "extjs/src/grid/plugin/",
                        "name": "HeaderResizer.js"
                    },
                    {
                        "path": "extjs/src/grid/",
                        "name": "Scroller.js"
                    },
                    {
                        "path": "extjs/src/grid/header/",
                        "name": "DragZone.js"
                    },
                    {
                        "path": "extjs/src/grid/header/",
                        "name": "DropZone.js"
                    },
                    {
                        "path": "extjs/src/grid/",
                        "name": "LockingView.js"
                    },
                    {
                        "path": "extjs/src/grid/plugin/",
                        "name": "HeaderReorderer.js"
                    },
                    {
                        "path": "extjs/src/grid/",
                        "name": "Lockable.js"
                    }
                ]
            },
            {
                "name": "Application - Production",
                "target": "app-all.js",
                "compress": true,
                "files": [
                    {
                        "path": "",
                        "name": "all-classes.js"
                    },
                    {
                        "path": "",
                        "name": "app.js"
                    }
                ]
            }
        ],
        "resources": []
    }
    Hopefully you find this helpful. I had to look around quite a bit to put all the pieces together myself when I first started and found this helped me a bit when it came to the SDK tools.

    http://www.sencha.com/forum/showthre...-the-SDK-tools

  11. #10
    Sencha User daubman's Avatar
    Join Date
    Jul 2010
    Location
    Massachusetts
    Posts
    34
    Answers
    1
    Vote Rating
    2
      0  

    Red face You do NOT have to hand-code the requires for the SDK tools to work! =)

    All,

    Please note that you DO NOT have to hand-craft the require statements in order to create the jsb3 file with the SDK. I'm not sure what changed, but the SDK finally started working for me WITHOUT specifying any require statements (fully using the dynamic loading).

    Here is my designer.html:
    Code:
    <!DOCTYPE html><!-- Auto Generated with Ext Designer -->
    <!-- Modifications to this file will be overwritten. -->
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>LaunchEventWindow.xds</title>
    <link rel="stylesheet" type="text/css" href="resources/css/ext-all.css" />
    <script type="text/javascript" src="extjs/ext-debug.js"></script>
    <script type="text/javascript" src="designer.js"></script>
    </head>
    <body></body>
    </html>
    Here is my designer.js:
    Code:
    /*
     * File: designer.js
     * Date: Mon Nov 21 2011 12:54:22 GMT-0500 (EST)
     *
     * This file was generated by Ext Designer version 1.2.2.
     * http://www.sencha.com/products/designer/
     *
     * This file will be auto-generated each and everytime you export.
     *
     * Do NOT hand edit this file.
     */
    
    Ext.Loader.setConfig({
        enabled: true
    });
    
    Ext.application({
        name: 'LaunchEventWindow',
    
        stores: [
            'lewStore'
        ],
    
        launch: function() {
            Ext.QuickTips.init();
    
            var cmp1 = Ext.create('LaunchEventWindow.view.MyViewport', {
                renderTo: Ext.getBody()
            });
            cmp1.show();
        }
    });
    Here is the output from 'sencha create jsb':
    Code:
    % sencha create jsb -a http://127.0.0.1:8080/LaunchEventWindow/designer-local.html -p lew.jsb3
    % cat lew.jsb3 
    {
        "projectName": "Project Name",
        "licenseText": "Copyright(c) 2011 Company Name",
        "builds": [
            {
                "name": "All Classes",
                "target": "all-classes.js",
                "options": {
                    "debug": true
                },
                "files": [
                    {
                        "path": "extjs/src/data/",
                        "name": "Association.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "IdGenerator.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Observable.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "validations.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "HashMap.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Filter.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "Connection.js"
                    },
                    {
                        "path": "extjs/src/data/writer/",
                        "name": "Writer.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "ResultSet.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Memento.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Sorter.js"
                    },
                    {
                        "path": "extjs/src/fx/",
                        "name": "CubicBezier.js"
                    },
                    {
                        "path": "extjs/src/panel/",
                        "name": "Proxy.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "Template.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "Operation.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "KeyMap.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "ZIndexManager.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "ComponentQuery.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "KeyNav.js"
                    },
                    {
                        "path": "extjs/src/fx/target/",
                        "name": "Target.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Floating.js"
                    },
                    {
                        "path": "extjs/src/draw/",
                        "name": "Color.js"
                    },
                    {
                        "path": "extjs/src/dd/",
                        "name": "StatusProxy.js"
                    },
                    {
                        "path": "extjs/src/layout/",
                        "name": "Layout.js"
                    },
                    {
                        "path": "extjs/src/layout/container/boxOverflow/",
                        "name": "None.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Offset.js"
                    },
                    {
                        "path": "extjs/src/fx/",
                        "name": "Queue.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "AbstractContainer.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "SortTypes.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "TextMetrics.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "ClickRepeater.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Animate.js"
                    },
                    {
                        "path": "extjs/src/state/",
                        "name": "Provider.js"
                    },
                    {
                        "path": "extjs/src/app/",
                        "name": "EventBus.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "AbstractManager.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "ModelManager.js"
                    },
                    {
                        "path": "extjs/src/app/",
                        "name": "Controller.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "AbstractMixedCollection.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "ComponentManager.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "Types.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "Field.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "Ajax.js"
                    },
                    {
                        "path": "extjs/src/data/writer/",
                        "name": "Json.js"
                    },
                    {
                        "path": "extjs/src/data/reader/",
                        "name": "Reader.js"
                    },
                    {
                        "path": "extjs/src/data/reader/",
                        "name": "Json.js"
                    },
                    {
                        "path": "extjs/src/data/proxy/",
                        "name": "Proxy.js"
                    },
                    {
                        "path": "extjs/src/data/proxy/",
                        "name": "Server.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Sortable.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "MixedCollection.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "StoreManager.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "Errors.js"
                    },
                    {
                        "path": "extjs/src/data/proxy/",
                        "name": "Ajax.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "Model.js"
                    },
                    {
                        "path": "extjs/src/fx/",
                        "name": "Easing.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "XTemplate.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "FocusManager.js"
                    },
                    {
                        "path": "extjs/src/fx/target/",
                        "name": "Sprite.js"
                    },
                    {
                        "path": "extjs/src/fx/target/",
                        "name": "Element.js"
                    },
                    {
                        "path": "extjs/src/fx/target/",
                        "name": "CompositeElement.js"
                    },
                    {
                        "path": "extjs/src/fx/target/",
                        "name": "CompositeSprite.js"
                    },
                    {
                        "path": "extjs/src/fx/target/",
                        "name": "Component.js"
                    },
                    {
                        "path": "extjs/src/fx/",
                        "name": "Manager.js"
                    },
                    {
                        "path": "extjs/src/fx/",
                        "name": "Animator.js"
                    },
                    {
                        "path": "extjs/src/draw/",
                        "name": "Draw.js"
                    },
                    {
                        "path": "extjs/src/fx/",
                        "name": "PropertyHandler.js"
                    },
                    {
                        "path": "extjs/src/fx/",
                        "name": "Anim.js"
                    },
                    {
                        "path": "extjs/src/layout/component/",
                        "name": "Component.js"
                    },
                    {
                        "path": "extjs/src/layout/component/",
                        "name": "AbstractDock.js"
                    },
                    {
                        "path": "extjs/src/layout/component/",
                        "name": "Dock.js"
                    },
                    {
                        "path": "extjs/src/layout/component/",
                        "name": "Tip.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Region.js"
                    },
                    {
                        "path": "extjs/src/dd/",
                        "name": "DragDropManager.js"
                    },
                    {
                        "path": "extjs/src/layout/container/boxOverflow/",
                        "name": "Scroller.js"
                    },
                    {
                        "path": "extjs/src/dd/",
                        "name": "DragDrop.js"
                    },
                    {
                        "path": "extjs/src/dd/",
                        "name": "DD.js"
                    },
                    {
                        "path": "extjs/src/dd/",
                        "name": "DDProxy.js"
                    },
                    {
                        "path": "extjs/src/dd/",
                        "name": "DragSource.js"
                    },
                    {
                        "path": "extjs/src/panel/",
                        "name": "DD.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "Container.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "Auto.js"
                    },
                    {
                        "path": "extjs/src/menu/",
                        "name": "Manager.js"
                    },
                    {
                        "path": "extjs/src/layout/component/",
                        "name": "Button.js"
                    },
                    {
                        "path": "extjs/src/state/",
                        "name": "Manager.js"
                    },
                    {
                        "path": "extjs/src/state/",
                        "name": "Stateful.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "AbstractComponent.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "Component.js"
                    },
                    {
                        "path": "extjs/src/container/",
                        "name": "AbstractContainer.js"
                    },
                    {
                        "path": "extjs/src/container/",
                        "name": "Container.js"
                    },
                    {
                        "path": "extjs/src/panel/",
                        "name": "Header.js"
                    },
                    {
                        "path": "extjs/src/toolbar/",
                        "name": "Fill.js"
                    },
                    {
                        "path": "extjs/src/button/",
                        "name": "Button.js"
                    },
                    {
                        "path": "extjs/src/toolbar/",
                        "name": "Item.js"
                    },
                    {
                        "path": "extjs/src/toolbar/",
                        "name": "Separator.js"
                    },
                    {
                        "path": "extjs/src/layout/container/boxOverflow/",
                        "name": "Menu.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "Box.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "VBox.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "HBox.js"
                    },
                    {
                        "path": "extjs/src/toolbar/",
                        "name": "Toolbar.js"
                    },
                    {
                        "path": "extjs/src/panel/",
                        "name": "AbstractPanel.js"
                    },
                    {
                        "path": "extjs/src/panel/",
                        "name": "Panel.js"
                    },
                    {
                        "path": "extjs/src/tip/",
                        "name": "Tip.js"
                    },
                    {
                        "path": "extjs/src/tip/",
                        "name": "ToolTip.js"
                    },
                    {
                        "path": "extjs/src/tip/",
                        "name": "QuickTip.js"
                    },
                    {
                        "path": "extjs/src/tip/",
                        "name": "QuickTipManager.js"
                    },
                    {
                        "path": "extjs/src/app/",
                        "name": "Application.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "Batch.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Point.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "PluginManager.js"
                    },
                    {
                        "path": "extjs/src/layout/component/",
                        "name": "Auto.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "Request.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "LoadMask.js"
                    },
                    {
                        "path": "extjs/src/resizer/",
                        "name": "Resizer.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "CSS.js"
                    },
                    {
                        "path": "extjs/src/menu/",
                        "name": "Item.js"
                    },
                    {
                        "path": "extjs/src/menu/",
                        "name": "CheckItem.js"
                    },
                    {
                        "path": "extjs/src/menu/",
                        "name": "KeyNav.js"
                    },
                    {
                        "path": "extjs/src/menu/",
                        "name": "Separator.js"
                    },
                    {
                        "path": "extjs/src/dd/",
                        "name": "DragTracker.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "ElementLoader.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "AbstractFit.js"
                    },
                    {
                        "path": "extjs/src/draw/",
                        "name": "CompositeSprite.js"
                    },
                    {
                        "path": "extjs/src/layout/component/",
                        "name": "Draw.js"
                    },
                    {
                        "path": "extjs/src/panel/",
                        "name": "Tool.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "Layer.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "Grouper.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "AbstractStore.js"
                    },
                    {
                        "path": "extjs/src/util/",
                        "name": "ComponentDragger.js"
                    },
                    {
                        "path": "extjs/src/window/",
                        "name": "Window.js"
                    },
                    {
                        "path": "extjs/src/layout/container/",
                        "name": "Fit.js"
                    },
                    {
                        "path": "extjs/src/menu/",
                        "name": "Menu.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "ComponentLoader.js"
                    },
                    {
                        "path": "extjs/src/draw/",
                        "name": "Surface.js"
                    },
                    {
                        "path": "extjs/src/draw/",
                        "name": "Component.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "Store.js"
                    },
                    {
                        "path": "extjs/src/data/",
                        "name": "ArrayStore.js"
                    },
                    {
                        "path": "extjs/src/resizer/",
                        "name": "ResizeTracker.js"
                    },
                    {
                        "path": "extjs/src/draw/",
                        "name": "Matrix.js"
                    },
                    {
                        "path": "extjs/src/data/proxy/",
                        "name": "Client.js"
                    },
                    {
                        "path": "extjs/src/data/reader/",
                        "name": "Array.js"
                    },
                    {
                        "path": "extjs/src/draw/",
                        "name": "SpriteDD.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "ShadowPool.js"
                    },
                    {
                        "path": "extjs/src/data/proxy/",
                        "name": "Memory.js"
                    },
                    {
                        "path": "extjs/src/draw/",
                        "name": "Sprite.js"
                    },
                    {
                        "path": "extjs/src/draw/engine/",
                        "name": "Vml.js"
                    },
                    {
                        "path": "extjs/src/draw/engine/",
                        "name": "Svg.js"
                    },
                    {
                        "path": "extjs/src/",
                        "name": "Shadow.js"
                    },
                    {
                        "path": "app/store/",
                        "name": "lewStore.js"
                    }
                ]
            },
            {
                "name": "Application - Production",
                "target": "app-all.js",
                "compress": true,
                "files": [
                    {
                        "path": "",
                        "name": "all-classes.js"
                    },
                    {
                        "path": "",
                        "name": "app.js"
                    }
                ]
            }
        ],
        "resources": []
    }
    I'm still a little confused as to why it didn't include the MyViewport.js files from view/ or view/ui/, but this is a lot of progress.

    Just wanted to provide some working examples of code that plays nicely with the SDK tools. Hope this helps somebody else.

    Thanks all!
    Aaron
    Last edited by daubman; 22 Nov 2011 at 5:27 AM. Reason: Removed extraneous CLI noise

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •