#javascript Require.js vs CommonJS / AMD modules and #angularjs

Oscar Brito


I recently replied to the following twitter conversation about require.js vs browserify.

@cowboy i'm using amd to create reusable code beetwen server and client and i like it. My main problem is integrating with angular, etc
— Oscar Brito (@aetheon) March 15, 2014

@aetheon @cowboy look up the angular di annotation style, very compatible with AMD modules.
— Tim Branyen (@tbranyen) March 15, 2014

Angular.js and AMD


Recently I tried to integrate some AMD modules into an angularjs application. I did not spent much time on it, but I was under the impression that the integration was not straightforward.

On this twitter thread @tbranyen pointed to me that using the angular dependency injection annotations I can easily reuse my existing require.js modules. I must give it a try on my next project.

AMD vs CommonJS


First of all I must say that I can understand the arguments from the CommonJS supporters but the require.js configuration file gives me extra powers...

An awsome feature of requirejs is that you can create different execution context. This means that you can, for instance, load different versions of the same module into two different context executions. This can be very powerful.
I'm using this on my js-utils project to make it just a repository of modules without hard dependencies. This means that js-utils node_modules folder will have just a few references.


var requirejs = require('requirejs');

requirejs = requirejs.config({

/// isolate this context
context: 'context1',

/// use local packages, located on nodemodules
nodeRequire: require,

/// modules baseurl
baseUrl: _
dirname,

/// the lookup paths
paths: [ ... ]

});



I do not consider myself a fanboy of require.js because,
  • I now that its complexity demands a bigger learning curve that its not always required. 
  • I know that browserify is more easy and compatible with node modules.
  • I know that its syntax can be very verbose.
  • I know that r.js need a lot of improvements.
  • I know that r.js source maps are almost useless (the variables and functions are already minified).

But I also know that,
  • I can create complex dependencies on require.js config file
  • I can create friendly alias on require.js config file
  • I can easily change version of the dependencies just by changing the configuration file
  • I can use different execution contexts

If I said anything wrong please let me know because I really want to hear your thoughts on this matter!

@aetheon





Visit www.divhide.com for more informations, contacts and news about Web Development.
See other blog posts at blog.divhide.com.



Divhide purpose is to follow the HTML5 movement and contribute with applications which prove the quality of technology.


Feel free to contact divhide.