Sea.js Manual & Documentation

Home | Index

---

Bootstrapping

You can load sea.js synchronously or asynchronously.

Sync Loading

This is the most straightforward way to load sea.js via the src attribute of script tag.

<script src="http://example.com/libs/seajs/1.1.0/sea.js"></script>

You can combine sea.js with other common libraries such as jquery.js:

http://example.com/libs/sea-jquery.js

It is recommended to use nginx concat module for automatically combination.

http://example.com/libs/??seajs/1.1.0/sea.js,jquery/1.7.1/jquery.js

** NOTICE: When using the combo service, the base path should be set manually in config.

<script src="http://example.com/libs/??seajs/1.1.0/sea.js,jquery/1.7.1/jquery.js"></script>
<script>
seajs.config({ 'base': 'http://example.com/libs/' });
seajs.use('underscore/1.1.6/underscore');
  //=> http://example.com/libs/underscore/1.1.6/underscore.js
</script>

Asynchronously Loading

It will be ironic that the JavaScript module loader for loading scripts asynchronously have to be loaded in a blocking manner. Here’s the snippet to make sure that sea.js itself could be loaded asynchronously:

<script>
// snip...

// load sea.js asynchronously:
;(function(m, o, d, u, l, a, r) {
  if(m[d]) return;
  function f(n, t) { return function() { r.push(n, arguments); return t; } }
  m[d] = a = { args: (r = []), config: f(0, a), use: f(1, a) };
  m.define = f(2);
  u = o.createElement('script');
  u.id = d + 'node';
  u.src = 'http://example.com/libs/seajs/1.1.0/sea.js';
  l = o.getElementsByTagName('head')[0];
  l.insertBefore(u, l.firstChild);
})(window, document, 'seajs');

// you can call seajs public method immediately:
seajs.config({
  'base': 'http://example.com/libs/'
});

seajs.use('./init', function(init) {
 // do some cool things.
});
</script>

use

Use this function to load the specified modules asynchronously and execute the optional callback when complete.

<script src="http://example.comlibs/seajs/1.1.0/sea.js"></script>
<script>
  seajs.use('path/to/init', function(init) {
    init.somethingA();
    init.somethingB();
  });
</script>

The callback parameter is optional.

<script src="http://example.com/libs/seajs/1.1.0/sea.js"></script>
<script>
  seajs.use('path/to/init');
</script>

The code above can be further simplified to data-main attribute.

<script src="http://example.com/libs/seajs/1.1.0/sea.js"
        data-main="path/to/init" ></script>

For more usages, see bootstrap/index.html