How to...

How to...

Bootstrap N-ext ?

Bootstraping N-Ext is as simple as:

var sencha = require('n-ext');
sencha.bootstrapCore();

The variable sencha above is an instance of the nExtLoader prototype, which API can be found here.

Declare another location for the ExtJS framework ?

var sencha = require('n-ext');
sencha.setExtPath('./library/Ext/');
sencha.bootstrapCore();

The 'setExtPath' method can take either an absolute or relative path. Write it as you would declare a path for node modules, as it is Node's require() that runs under the hood.

Note on Ext.Loader

All the namespaces which roots are located on the same folder that the Ext namespace are available directly to the Dynamic class loading package of ExtJS 4.

Example: Consider the following file structure

-%Project_Root%
   |-library
      |-Ext
      |-Pkg1
         |-...
      |-Pkg2
         |-...

If you bootstrap your application as above, you can write the following code without having to configure Ext.Loader:

Ext.require('Pkg1.model.Awesome');

Declare another location for custom namespaces ?

ExtJS requires that you declare each and every namespace wherein you want to use the autoloader they provide. So, if you want to use a namespace Foo, which contains classes you want to have dynamically loaded in your app, you have to do the following:

Ext.Loader.setPath('Foo', './library/Foo');

With N-Ext, you can use another mechanism, taking advantages of the capabilities of NodeJS' require function. Let's say you have a bunch of namespaces (NS1, NS2 and so on) located in a single folder (a priori another folder that the one containing the Ext library) called vendor. Using the line of code below, you won't be required to run Ext.Loader.setPath(..) anymore for those namespaces.

var sencha = require('n-ext');
sencha.addLibPath('./vendor/'); // <-- This one!
sencha.bootstrapCore();

Ext.require('NS1.model.Foo'); // It Works!

Of course, you can add as many paths as you want.