Method of loading different ExtJs versions via RequireJS (AMD)

The old code uses the outdated ExtJs version (version 4.x). New code should use ExtJs 5.x

I'm trying to load ExtJs 5 on the same page where ExtJs 4 is already loaded and used by some other JavaScript code.

I want to hide ExtJs 5 from the rest of the code. Something like:

define(["../../extjs-5.0.1/ext-all.js"], function (extjs) {
        //TODO use the "extjs" as link to Ext js global variable
});

      

        
        
        
      

    

ExtJs is not implemented as an AMD module, so I cannot load it as described in the previous example.

Could you please give me a workaround for the problem? Can I use some AMD wrapper which is the module itself and returns the j <> t21> variable defined in the file ext-all.js

.

Is there a way to reuse a script that was written as a regular JavaScript file (like ExtJs) as an AMD module?

UPDATED: I read about the RequireJS step section, here's what I'm trying to do:

From the html page:

<script data-main="../js/configuration/skin/app" src="../requirejs/require-2.1.17.js"></script>

      

        
        
        
      

    

App.js file:

requirejs.config({
    baseUrl: '../js',
    paths: {
        app: 'configuration/skin',
        extjs5: '../extjs-5.0.1/ext-all'
    },
    shim: {
        'extjs5': {
            exports: 'Ext'
        }
    }
});

requirejs(['app/main']);

      

        
        
        
      

    

main.js file:

define(['extjs5'], function (extjs5) {
    //extjs5 is not nullable, it points to Ext variable
    // but Ext.getVersion() points to version 5
});

      

        
        
        
      

    

Now the problem, the global variable Ext points to version 5. This might be the problem. I want the Ext js global variable not to change.

When I remove all extjs related version 5, app.js:

requirejs.config({
    baseUrl: '../js',
    paths: {
        app: 'configuration/skin'
    }
});

requirejs(['app/main']);

      

        
        
        
      

    

main.js:

define(function () {
    // here I test Ext.getVersion() it points to version 4, not 5, as expected
});

      

        
        
        
      

    

In the last method, Ext.getVersion () - refers to version 4, which is loaded by default for the page.

How can I use ExtJs 5 in my module and not touch the existing global Ext (version 4)?