creating all classes from sencha sdk

Question

I'm trying to use the sencha sdk to generate my minified file.

I have my page set up on

http://www.mysite.localhost/ext/jobs/index.html

reading from just index.html is not easily possible. When i enter

sencha create jsb -a http://www.mysite.localhost/ext/jobs/index.html -p app.jsb3

I get the following jsb file.

{
    "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": []
}

ie it's not included all my classes. If i update

"path": "app/", "name": "app.js"

app-all.js is created correctly. But how can i get the controllers and views. There are a lot of files. Does any one have any example mvc application jsb. My app is base on pandora.

app/app.js

    Ext.Loader.setConfig({ enabled: true });
    Ext.application({

        name: 'Pandora',
        models: ['Part', 'Material', 'Job', 'Process', 'Invoice', 'InvoiceDetail', 'PurchaseOrder'],
        stores: ['SalesContact', 'Parts', 'Materials', 'Jobs', 'AccountHandlers', 'JobTypes', 'Processs', 'Artwork', 'Varnish', 'VarnishType', 'PrintType', 'ProofRequired', 'InvoiceDetails', 'PurchaseOrders'],
  controllers: ['Part', 'Material', 'Job', 'Process', 'Invoice'],
        launch: function () {

            Ext.QuickTips.init();
            var cmp1 = Ext.create('App.view.Jobs', {
                renderTo: "form-job"
            });
            cmp1.show();
        }

    });

index.html

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <script type="text/javascript" src="ext-all-debug.js"></script>
    <script type="text/javascript" src="app/app.js"></script>
</head>
<body>
    <div id="form-job"></div>
</body>
</html>

I am having the same problem myself at the moment. I am missing my ux, controllers, and views. It manages to find my stores and models. That's it. I am looking for how the **requires:** property comes into play with respect to the Viewport. You pass it an array of views, and one would infer the controllers with it. — subv3rsion, Feb 14 '12 at 17:11

subv3rsion · Accepted Answer · 2012-04-21T13:59:04.813

3

Update

We got this working without the need for including everything in Ext.Loader() in app.js. Make sure you pass Ext.Loader() an array with your Viewport class. Still make sure you do the correct uses: and requires:. That way you final output for the jsb3 file contains everything.

I managed to sort this out on my end. I needed to use the Ext.Loader() in my app.js file. The general idea is you need to tell the loader where your source files are. Making sure your class file's are included in the build. Based on your code above for app/app.js.

Ext.Loader.setConfig({ enabled: true });

// SDK builder required source files, use the class names.
Ext.Loader.require(['Pandora.view.Viewport']);

Ext.application({

    name: 'Pandora',
    models: ['Part', 'Material', 'Job', 'Process', 'Invoice', 'InvoiceDetail', 'PurchaseOrder'],
    stores: ['SalesContact', 'Parts', 'Materials', 'Jobs', 'AccountHandlers', 'JobTypes', 'Processs', 'Artwork', 'Varnish', 'VarnishType', 'PrintType', 'ProofRequired', 'InvoiceDetails', 'PurchaseOrders'],
    controllers: ['Part', 'Material', 'Job', 'Process', 'Invoice'],
    launch: function () {

        Ext.QuickTips.init();
        var cmp1 = Ext.create('App.view.Jobs', {
            renderTo: "form-job"
        });
        cmp1.show();
    }

});

I found that in your view and controller classes make sure if you have stores tied to your view (like a combobox) that you are adding items to the view itself in the initComponent and you use the requires: 'MyApp.store.Users' for the class. Or you will receive strange errors as the view will initialize before the store.

The Ext.Loader.require() must be placed before the Ext.Application. Once you have it all setup with the models and controllers, you'll want to add your views too.

You should be in a good place to create your jsb3 file now, and see that your models, views, and controllers are now part of the process for the build.

edited Apr 21 '12 at 13:59

answered Feb 14 '12 at 18:38

subv3rsion

412
6
14

Some other helpful hints [Using the SDK tools](http://www.sencha.com/forum/showthread.php?142768-Using-the-SDK-tools) – subv3rsion Feb 14 '12 at 21:17
great, thanks for this. I'm going to have another session on this tomorrow. I'll post my findings. – frosty Feb 15 '12 at 10:24
Always happy to help. Don't forget to bump the answer as useful if it does help. We are supposed to have another session ourselves focusing on the sencha sdk and this subject. – subv3rsion Feb 16 '12 at 21:24
2

Another thing thats worth adding is if you have authentication on your app, you'll want to disable it when generating your file in most cases. I do a detection on localhost and the PhantomJS/1.1.0 user agent to disable mine automagically when I want to regenerate my list of all-class files – Jamie Sutherland Apr 21 '12 at 14:05
@JamieSutherland interesting solution for auth. We made a whole separate directory with .html referencing our app just to get everything to play nice with the Sencha SDK tools because of the auth in our application. – subv3rsion Apr 21 '12 at 14:49
2

The SDK tools are a bit awkward to get up and running with it must be said. I've had to dig into the source code a few times to workout odd behaviour. I wish they'd open source the SDK as I've made a few changes to the code to help when building multiple versions of the same app. Plus we could help with documenting how it works. Sounds like a topic blog post in the near future! – Jamie Sutherland Apr 21 '12 at 15:19
@subv3rsion - thanks your spot on. Re "make sure if you have stores tied to your view" can you expand on how best to do this. I've set up new question. http://stackoverflow.com/questions/11054269/adding-views-using-ext-sdk-store-issue – frosty Jun 15 '12 at 16:01
+100 was screwing around with this for a couple of hours until I saw your answer – egerardus Mar 23 '13 at 19:23

creating all classes from sencha sdk

1 Answers1