2

Is it possible to use Dojo build without the need to modify JavaScript files?

The article dgrid and Dojo Nano Build provides the instruction to create the build, but it requires adding the following line into JavaScript file, which initializes the application:

require(['dgrid/dgrid'], function () {

(replacing 'dgrid/dgrid' with your build module name).

However, it is very problematic when using build for own modules, because, of course, in development mode the require with own layer can't be included, otherwise the modifications made to own modules wouldn't be visible. But in production mode this line must be added.

So either you must modify the file manually before production build, or write a script that would modify the file during the build. Both are very error-prone.

Is there a better way to achieve that result? Is it possible for Dojo to recognize that the build is provided and should be used, instead of loading each module separately?

Web Devie
  • 1,207
  • 1
  • 13
  • 30

1 Answers1

2

The following line of code can be included in both development and production modes. 

require(['dgrid/dgrid'], function () {

I describe the reasons why in my answer here.

What you need to do is configure Dojo differently based on what environment.

In a blog post that I wrote, I describe this in more detail. The following summarizes the post:

I create three modes: Production, Uncompressed, and Development.

Development

When developing code, I will have the js source linked into the web server and the Development mode will point to the dojo.js file and the raw css file(s). The browser will load modules that I need using xhr. And I point to the top level css files which import other css files. The result is that a lot of requests will be made to the server and the loading of the page will be noticeably slow. The benefit is that you can see development changes without having to do a full build.

Production

Production mode points the main dojo file at the dojo.js that is built using the build tool. I also create <script> elements for the other layers that are needed in the page. I point the css to the built css files which the build tool has inlined the imported css. The page loads quickly, but it is difficult to debug

Uncompressed

Similar to production, but I point to the .uncompressed.js files. Production and Uncompressed are available in the released version of our software. I use uncompressed when trying to troubleshoot an issue in a production environment. The value of this mode is dwindling as the developer tools are better supporting compressed javascript (ie source maps, etc.)

Server side

The default mode is Production, but I use a query parameter to switch modes. I also store the current mode in the session, so that I only have to set the mode once to change it. Subsequent pages will run in the changed mode, until I change it back.

Here is a java implementation of this code.

Community
  • 1
  • 1
Craig Swing
  • 8,152
  • 2
  • 30
  • 43
  • It works very nice. I don't have to change any JS or even HTML file. If the builds are not available, there's only a 404 visible in console, and everything is loaded in development mode. – Web Devie Jul 22 '13 at 14:38
  • However, it is not working on IE9 when the app is loaded from WebSphere. Error somewhere in build file: property 'dir' is not defined. I had to put it in require anyway. – Web Devie Jul 30 '13 at 06:32
  • Had to put what in require? If the build worked for one browser and not another, than it's probably not a problem with the build and a problem with the code that is being built, but without any details, it's hard to say. – Craig Swing Jul 30 '13 at 10:15
  • Put loading layer via require. The code I posted in separate question: http://stackoverflow.com/questions/17940043/dojo-build-fails-on-ie9-when-loading-layer-from-html-header-property-dir-is-u – Web Devie Jul 30 '13 at 10:20