CODEWITHSUNDEEP
dojo
El Guapo
El Guapo

Reputation: 5781

Dojo 1.10 Create one .js file with all modules needed

I've been reading a lot about the new features in Dojo (after 1.6)... is it possible to build one .js file that contains not only the dojo.js file, but also all the modules (and their dependencies) required for the page?

Thanks.

Upvotes: 2

Views: 1582

Answers (1)

Ken Franqueiro
Ken Franqueiro

Reputation: 10559

The build system in Dojo 1.x (both pre- and post-AMD) supports build layers which do exactly what you're asking for. You configure layers with the top-level modules your application needs, then the build process will recursively scan for dependencies to include everything your application modules need in one module.

A modern Dojo build profile will typically look like the following:

var profile = {
    action: 'release',
    basePath: 'src',
    releaseDir: '../dist',

    // Strip comments and newlines from CSS and flatten imports
    cssOptimize: 'comments',

    // Use the Closure compiler (which supports dead code removal)
    // for layer optimization; uglify is also a choice
    layerOptimize: 'closure',

    // Specify the packages the build should scan
    // (only include the ones you use; this follows the same format
    // as the AMD packages option if you need to specify paths)
    packages: [ 'dojo', 'dijit', 'dojox', 'app' ],

    // Layers should always be defined over existing modules.
    // You can define a layer over your own top-level application module,
    // or you can redefine dojo/dojo so that all of your code is
    // included as soon as you load dojo.js
    layers: {
        'dojo/dojo': {
            // This layer includes the loader
            boot: true,
            // When building dojo/dojo, don't bundle all of dojo/_base
            customBase: true,
            include: [ 'app/main' ]
        }
    }
};

With an ideal build profile for a simple application that warrants building everything into one module, you should end up only needing to load the following in production:

  • 1 JS file (dojo.js)
  • 1 NLS file (NLS bundles get consolidated to match each configured layer)
  • 1 CSS file (due to import flattening with cssOptimize)
  • Images

Additional resources:

Upvotes: 6

Related Questions