General question about DOJO declarative programming

Question

Hello everyone,

I'm using the declarative programming of DOJO and it's working just fine but I must admit that I'm losing quite some time struggling with the order of my

require(

[...],

function

(...)

{...}

);

lists (which are now quite LONG... ;) .

I can't seem to find any clear rule or explanation on any documentation about HOW these MANY objects should be ordered and declared (besides that the order must be the same in both lists, that is the general info I already gathered),

especially concerning the parser,

and in the require list:

-the esri/layers/...

-the esri/dijit/...

-the dojo/...

-the dijit.layout/...

(and so on...)

Can someone explain that in few lines or send a link to a documentation which clearly states the rules?

Thanx in advance!

ChrisSmith7 · Answer

I second this...

Vincent,

I use the same method as Ken and started to modularize as my map application expanded, e.g.:

var dojoConfig = {

packages: [{

"name": "jsModules",

"location": location.pathname.replace(/\/[^/]+$/, "") + "/jsModules"

}]

};

...

require([

"jsModules/myModuleFoo",

"jsModules/myModuleBar"

], function (

myModuleFoo,

myModuleBar

) {

ready(function () {

...

Your own modules would contain only the Esri modules that are needed... The dojoConfig at the top allows you to include user modules in your main code file. Not sure if this is helpful, but here's an Esri example that uses "extra" modules:

https://developers.arcgis.com/javascript/jssamples/layers_point_clustering.html

The "extra" module code file in the example is located here:

http://developers.arcgis.com/javascript/samples/layers_point_clustering//extras/ClusterLayer.js

This isn't a very elegant way of doing things, but, if you keep everything on single lines, you can easily reorder in Excel! Just copy each part as separate columns, sort one column and expand the selection to maintain the association/order, then paste back into your document making sure to fix the mismatched commas.

GavinRehkemper · Answer

If you use SublimeText by chance, you can use the AMD Butler Package to automatically sort them like Ken Buja​ mentioned above.

kenbuja · Answer

What I've found helpful is to group the modules by their source (esri, dojo, dojox, dijit). This way, I'm less likely to have issues when adding in extra modules and their accompanying arguments as the project grows. In the long run, this extensive list of modules means I should work harder at factoring my code...

require(["dojo/ready",
         "dojo/aspect",
         "dojo/_base/array",
         "dojo/_base/Color",
         "dojo/_base/declare",
         "dojo/_base/lang",
         "dojo/Deferred",
         "dojo/dom",
         "dojo/dom-construct",

"dojox/gfx/fx",
         "dojox/layout/FloatingPane",

"dijit/form/CheckBox",
         "dijit/MenuItem",
         "dijit/registry",

"dgrid/ColumnSet",
         "dgrid/OnDemandGrid",
         "dgrid/Selection",

"esri/domUtils",
         "esri/geometry/Extent",
         "esri/graphic",
         "esri/InfoTemplate",
         "esri/layers/ArcGISDynamicMapServiceLayer",
         "esri/layers/ArcGISTiledMapServiceLayer",
         "esri/layers/GraphicsLayer",
         "esri/map",
         "esri/urlUtils",

"esri/dijit/Basemap",
         "esri/dijit/BasemapGallery",
         "esri/dijit/BasemapLayer",
         "esri/dijit/InfoWindow",

"esri/symbols/SimpleFillSymbol",
         "esri/symbols/SimpleLineSymbol",
         "esri/symbols/SimpleMarkerSymbol",

"esri/tasks/IdentifyTask",
         "esri/tasks/IdentifyParameters",
         "esri/tasks/QueryTask",
         "esri/tasks/query",

"agsjs/dijit/TOC",

"modules/ProjectList",

"dojo/domReady!"],
    function (ready, aspect, arrayUtils, Color, declare, lang, Deferred, dom, domConstruct, 
              dojoxGfxFx, FloatingPane,
              CheckBox, MenuItem, registry, 
              ColumnSet, Grid, Selection, 
              domUtils, Extent, Graphic, InfoTemplate, ArcGISDynamicMapServiceLayer, ArcGISTiledMapServiceLayer, GraphicsLayer, Map, urlUtils,
              Basemap, BasemapGallery, BasemapLayer, InfoWindow, 
              SimpleFillSymbol, SimpleLineSymbol, SimpleMarkerSymbol,
              IdentifyTask, IdentifyParameters, QueryTask, Query,
              TOC,
              ProjectList