CODEWITHSUNDEEP
extjsextjs5extjs6
Jacobian
Jacobian

Reputation: 10802

From ExtJs 5 to 6. Simple code migration

I'm not sure why, but my teeny-weeny code that worked in ExtJs 5, now does not work in ExtJs 6. It is a very basic code and looks like this:

//TestApp/app.js

Ext.Loader.setConfig({enabled:true, disableCaching:true});
Ext.application({
    name:'TestApp',
    appFolder:'/TestApp',
    requires:['Ext.container.Viewport', 'Ext.layout.container.Border'],
    controllers:['TestAppController'],
    autoCreateViewport:true
});

============

//TestApp/view/Viewport.js

Ext.define('TestApp.view.Viewport',{
    extend:'Ext.container.Viewport',
    layout:'fit',
    initComponent:function(){
        Ext.apply(this,{
            layout:{
                type:'border'
            },
            items:[{
                region:'west',
                layout:'fit',
                width:500,
                collapsible:true,
                collapseMode:'mini',
                split:true,
                autoScroll:true
            },{
                region:'center',
                layout:'fit'
            }]
        });
        this.callParent(arguments);
    }
});

============

//TestApp/controller/TestAppController.js

Ext.define('TestApp.controller.TestAppControler',{
    extend:'Ext.app.Controller',
    init:function(){}
});

So, when I run my application, I see in the console, that first ExtJS css libraries are loaded, then the main ext-all.js file, then app.js, then Viewport.js, and finally TestAppControler.js. So, the library and all application source code is loaded ok - I clearly see it in the console. However, what I see in browser is just a blank page. I guess, I miss something, some piece of code, which is specific to ExtJS 6 (like some launch command or something like that).

Upvotes: 1

Views: 256

Answers (1)

CD..
CD..

Reputation: 74126

That might be related to the fact autoCreateViewport is deprecated, try using mainView instead.

Upvotes: 2

Related Questions