1. #1
    Sencha User
    Join Date
    Apr 2012
    Posts
    18
    Vote Rating
    0
    acorotchi is on a distinguished road

      0  

    Default requires : [ 'App.util.Config'] error in multiple profile app, production version

    requires : [ 'App.util.Config'] error in multiple profile app, production version


    Hi guys, I am using a "config" for some global variables used several times in the app.

    it is a singleton object like this :



    Ext.define('APP.util.Config', { singleton : true, alias : 'widget.appConfigUtil', config : { baseUrl : 'xx.xx.xx.xxx', }, constructor: function(config) { this.initConfig(config); this.callParent([config]); }})
    and in app.js I include like this:


    requires : [ 'App.util.Config']
    and access format is like this:


    App.util.Config.getBaseUrl();
    Works fine until I start to have 2 profiles in app "Phone/Tablet"

    pretty much all .js files in outside of "phone/tablet" folder (the one used for both profiles), I can access the util.Config, works as well when I compress in "production" build.

    The issue is just in "production" version (compressed), when I try to access "util.Config" variables from
    one of the profile folder (phone/table). for example :

    "app/view/phone/Home.js"

    So far I fix the solution by adding requires : [ 'App.util.Config'] in every sigle file where I neet to access any of the "config variables" in one of the profile folder (phone/tablet).

    Question is:

    There is a way not to duplicate requires : [ 'App.util.Config'], because theoretically The file was already required in "app.js" which is the main file.

    Thanks in advice !

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,226
    Vote Rating
    859
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    You should be able to require the class in app.js using Ext.require() before anything else and that will allow it to be used everywhere.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    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.

  3. #3
    Sencha User
    Join Date
    Apr 2012
    Posts
    18
    Vote Rating
    0
    acorotchi is on a distinguished road

      0  

    Default


    But that it is exactly what I do, and feels like it doesn't work.

    i tried to use both scenarios in app.js:

    1)

    Code:
    .....
    
    Ext.require(    'MyApp.util.config'
    );
    
    
    Ext.application({
    .....
    2)

    Code:
    ...
    requires: [
            'Ext.MessageBox'
            'MyApp.util.config'
        ],
    
    ....

    And how I said before it works everywhere except the stuff is in any profile pages, for example here doesn't work:

    Code:
    ..
    Ext.define('MyApp.view.phone.Events', {
    ...
    PS: everything works in development mode, just the "production" version has issue.


    Thanks.

  4. #4
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,226
    Vote Rating
    859
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    Hm, it's working from me. I generated an app using 2.2.0, created a Phone profile and an Events view for the Phone profile both are using the Config singleton. Here are my sources (without edit):

    app/util/Config.js:
    Code:
    Ext.define('MyApp.util.Config', {
        singleton : true,
    
        config : {
            foo : 'bar'
        },
    
        constructor : function(config) {
            this.initConfig(config);
            this.callParent([config]);
        }
    });
    app.js
    Code:
    /*
        This file is generated and updated by Sencha Cmd. You can edit this file as
        needed for your application, but these edits will have to be merged by
        Sencha Cmd when it performs code generation tasks such as generating new
        models, controllers or views and when running "sencha app upgrade".
    
        Ideally changes to this file would be limited and most work would be done
        in other places (such as Controllers). If Sencha Cmd cannot merge your
        changes and its generated code, it will produce a "merge conflict" that you
        will need to resolve manually.
    */
    
    // DO NOT DELETE - this directive is required for Sencha Cmd packages to work.
    //@require @packageOverrides
    
    //<debug>
    Ext.Loader.setPath({
        'Ext': 'touch/src',
        'MyApp': 'app'
    });
    Ext.require([
        'MyApp.util.Config'
    ]);
    //</debug>
    
    Ext.application({
        name: 'MyApp',
    
        requires: [
            'Ext.MessageBox'
        ],
    
        profiles : [
            'Phone'
        ],
    
        icon: {
            '57': 'resources/icons/Icon.png',
            '72': 'resources/icons/Icon~ipad.png',
            '114': 'resources/icons/Icon@2x.png',
            '144': 'resources/icons/Icon~ipad@2x.png'
        },
    
        isIconPrecomposed: true,
    
        startupImage: {
            '320x460': 'resources/startup/320x460.jpg',
            '640x920': 'resources/startup/640x920.png',
            '768x1004': 'resources/startup/768x1004.png',
            '748x1024': 'resources/startup/748x1024.png',
            '1536x2008': 'resources/startup/1536x2008.png',
            '1496x2048': 'resources/startup/1496x2048.png'
        },
    
        launch: function() {
            // Destroy the #appLoadingIndicator element
            Ext.fly('appLoadingIndicator').destroy();
            
            //"main" view will be created in profile
        },
    
        onUpdated: function() {
            Ext.Msg.confirm(
                "Application Update",
                "This application has just successfully been updated to the latest version. Reload now?",
                function(buttonId) {
                    if (buttonId === 'yes') {
                        window.location.reload();
                    }
                }
            );
        }
    });
    app/profile/Phone.js
    Code:
    Ext.define('MyApp.profile.Phone', {
        extend : 'Ext.app.Profile',
    
        config : {
            name  : 'Phone',
            foo   : MyApp.util.Config.getFoo(),
            views : ['Events']
        },
    
        isActive : function() {
            console.log('isActive', this.getFoo());
    
            return true;
        },
    
        launch : function() {
            var comp = Ext.create('MyApp.view.phone.Events');
    
            console.log('launch', comp.getFoo());
    
            Ext.Viewport.add(comp);
        }
    });
    app/view/phone/Events.js
    Code:
    Ext.define('MyApp.view.phone.Events', {
        extend : 'Ext.tab.Panel',
        xtype  : 'myapp-phone-main',
    
        requires : [
            'Ext.TitleBar',
            'Ext.Video'
        ],
    
        config : {
            tabBarPosition : 'bottom',
            foo            : MyApp.util.Config.getFoo(),
            items          : [
                {
                    title   : 'Welcome',
                    iconCls : 'home',
    
                    styleHtmlContent : true,
                    scrollable       : true,
    
                    items : {
                        docked : 'top',
                        xtype  : 'titlebar',
                        title  : 'Welcome to Sencha Touch 2'
                    },
    
                    html : [
                        'You\'ve just generated a new Sencha Touch 2 project. What you\'re looking at right now is the ',
                        'contents of <a target="_blank" href="app/view/Main.js">app/view/Main.js</a> - edit that file ',
                        'and refresh to change what\'s rendered here.'
                    ].join('')
                },
                {
                    title   : 'Get Started',
                    iconCls : 'action',
    
                    items : [
                        {
                            docked : 'top',
                            xtype  : 'titlebar',
                            title  : 'Getting Started'
                        },
                        {
                            xtype     : 'video',
                            url       : 'http://av.vimeo.com/64284/137/87347327.mp4?token=1330978144_f9b698fea38cd408d52a2393240c896c',
                            posterUrl : 'http://b.vimeocdn.com/ts/261/062/261062119_640.jpg'
                        }
                    ]
                }
            ]
        }
    });
    The two tests are in the isActive and launch method of the Phone profile where it checks the two places where the Config singleton class is used. I have highlighted in red the bits that are important in my sources.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    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.

Thread Participants: 1

Tags for this Thread