The dependency notion is quite trivial, until now we have covered dependencies between modules. However AMD allows to define dependencies onto a resource loaded by a module based on the loader plugin.

A module that uses a loader plugin shall use a ! to delineate between the loader plugin module to use and the target resource to load. Loader plugin are interesting because they can load resources thanks to the AMD loading mechanism and benefit from the same performances and parallel loading.

There are some useful loader plugin:

• The text plugin for loading text resources such as a stylesheet or a template

• The i18n plugin for internationalized bundle support

Using configuration in GateIn for AMD loader plugin’s target resource is straightforward. For example, we want to build some HTML by Javascript, the text.js AMD loader plugin can help with this issue. The plugin will load the template (plugin’s resource) and pass it into your module definition callback as a parameter.

First, we need to declare text as a GateIn module, it was written as a native module that depend on a predefined module of RequireJS module. Thanks to the native support mechanism, this configuration works transparently without modifying the 3rd party library.

<module>
  <name>text</name>
  <script>
    <path>/requirejs/js/plugins/text.js</path>
  </script>
  <depends>
    <!-- here module means RequireJS itself -->
    <module>module</module>
  </depends>
</module>

Now let's define our foo module that need the text plugin to load the template via the resource XML tag:

<module>
  <name>foo</name>
  ...
  <depends>
    <module>text</module>
    <as>myTemplate</as>
    <resource>/path/to/template.tmpl</resource>
  </depends>
</module>

Finally, the foo module will have its template loaded by the text plugin:

(function(myTemplate) {
  //parse the 'myTemplate' then append to DOM
})(myTemplate);