Launch code before Application creation and requirement

Question

I have question about the best way to implement correctly my code.

I have this in app.js

/*** EXT LOADER ENABLE & PATH                       ***/
Ext.Loader.setConfig(
{
    enabled             : true,
    application         : 'MyApp'
});

Ext.log('--- APPLICATION --- Loading Elasticsearch configuration');
Ext.define('MyApp.configuration.elastic',
{
    singleton   : true,
    ...
    loadElasticConfiguration: function()
    {
        // ExtDirect or ajax call in order to set configuration
    }
});
MyApp.configuration.elastic.loadElasticConfiguration();

Ext.onReady(function()
{});

Ext.create('MyApp.Application');

This is working well but I do not like to have lots of code is app.js. Is there a way to "export" the "MyApp.configuration.elastic" code to a specific file and call it. I have tried via Ext.require but others files which needs this config are loaded before ...

If anyone has a clue.

Have a good day !

Answer 1

If you want to use Ext.require you will need to create your application within the Ext.onReady listener:

Ext.require('MyApp.configuration.elastic');

Ext.onReady(function(){
    Ext.create('MyApp.Application');
});

Alternatively, this should also work as it will make your application's main class require the config class:

Ext.define('MyApp.Application', {
    requires: ['MyApp.configuration.elastic'],
    // ...
});