Hi,
to clarify:
- Which Dojo version are you using exactly?
- Are you using Dojo programmatically or declaratively?
- In production, are you using a custom build, like Matthew described, now?
You wrote above, that you are using dijit.js, which is not exactly what
Matthew wrote. I recommend:
Your structure should look like
/scripts/dojo/
/scripts/dojo/dijit - unchanged
/scripts/dojo/dojo - unchanged
/scripts/dojo/dojox - unchanged
/scripts/dojo/layer - custom
/scripts/dojo/yourCompany - custom
/scripts/dojo/css - custom
in "/scripts/dojo/layer" you will create a file "myApp.js", where you put
all your "dojo.require()" calls. For example:
dojo.provide("layer.MyApp");
dojo.require("yourCompany.form.input");
..dojo.require("yourCompany.form.YetAnotherFormControl");
..dojo.require("yourCompany.widget.YetAnotherWidget");
dojo.require("dijit.form.DateTextBox");
The "provide" line is important to let the build/load system know, what we
should have now and prevent duplicated code. For example, if you put your
layer into a library, someone could call "dojo.require("layer.MyApp");" and
would load "yourCompany.form.input",
"yourCompany.form.YetAnotherFormControl",
"yourCompany.widget.YetAnotherWidget", "dijit.form.DateTextBox".
You can also put additional JavaScript code into this file. When you build
"layer.MyApp", all these dojo.require calls will be resolved and the code
embedded into "release/layer/MyApp.js". If you are using options like
"optimize=shrinkSafe", the resulting JS will be shrinked, too.
You can do the same with all your CSS, used by your Dojo application. In
"/scripts/dojo/css/" you will create a file "myApp.css", where you put all
your "import" calls of the CSS you used in your Dojo controls/widgets, for
example:
@import url("../dijit/themes/tundra/tundra.css");
@import url("../yourCompany/styles/YetAnotherWidget.css");
Your build profile will look like
dependencies = {
stripConsole: "normal",
copyTests: false,
layers: [
{
name: "../layer/myApp.js",
resourceName: "yourCompany.myApp",
copyrightFile: "../../yourCompany/copyright.txt",
dependencies: [
"layer.myApp"
]
}
],
prefixes: [
[ "dijit", "../dijit" ],
[ "dojox", "../dojox" ],
[ "css", "../css" ],
[ "yourCompany", "../yourCompany" ]
]
}
You can build this profile now:
build profile=myApp optimize=shrinkSafe cssOptimize=comments.keepLines \
releaseName= action=release version=1.0
Notice, that I set an empty releasesName.
Now, you can copy "/scripts/dojo/release" to your QA/production system. It
will replace "/script/dojo" (!)
You just need to tell Zend Framework to include "dojo.js" (the Dojo Core)
and your layer ("layer/myApp.js"). While developing, all your dojo.require()
calls will result in a XHR like you already know.
But in production - if you didn't forget a dojo.require call, all used
resources are already embedded and now loaded via your "layer/myApp.js"
file.
Remember, you are still able to load additional files, which aren't included
in your current "build". Mostly you will see that language resources are
still loaded via XHR. But that doesn't matter: If these XHR will fail, you
will use the default language and if you want to, you can also include
language resources into your layer.
--
Regards,
Thomas
