• Stars
    star
    195
  • Rank 199,374 (Top 4 %)
  • Language
    JavaScript
  • License
    Other
  • Created about 12 years ago
  • Updated almost 5 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

AMD loader, like requirejs, but with promises and for modern browsers

alameda

An AMD loader, like requirejs, but with the following implementation changes:

  • Assumes Promises are available in the JS environment.
  • Targets "modern" web browsers that implement standardized script.onload behavior: execute load listener right after script execution, something IE9 and below did not do.
  • Assumes browser support for Array.isArray, array extras, ES5 features.
  • Does not support a couple of less-used APIs (see tests section below).

These changes means alameda is around 35% smaller than requirejs, 4.1 KB vs 6.4 KB, minified+gzipped sizes.

Browser support: browsers that natively provide Promises. If you need to support IE 10 and 11, the alameda-prim project includes a private promise shim.

You can continue to use requirejs and the r.js optimizer for other scenarios. The r.js optimizer works well with alameda-based projects.

Install

Latest release information

If using a package manager:

npm install alameda

# or

[npm | bower | volo] install requirejs/alameda

API

alameda supports the requirejs API. It even declares requirejs, to make passing the requirejs tests easier. alameda also has a good chance of becoming requirejs in a far-future requirejs version.

There are some differences with requirejs though:

require promise

require([]) will return a promise. The success callback passed to require([]) should return a value if you want a value to be passed to the next .then() in the promise chain.

require(['a', 'b'], function(a, b) {
  // succes callback. Return a value for the next part in the promise chain.
  return [a, b];
}).then(function(mods) {
  //mods[0] is the 'a' module, mods[1] is the 'b' module in this case.
});

config.defaultErrback

In requirejs and alameda, with this sort of call, the errback will be called if there is an error in either loading ['a', 'b'] or if the success callback throws an error.

require(['a', 'b'], function(a, b) {
  // success callback
}, function(err) {
  // errback, called if 'a', 'b' do not load, or
  // if the success callback is called.
});

So, the errback operates like:

require([], function() {}).catch(function(err) {})`;

If you do not pass an errback into the require() call, and instead use a .then() or .catch() to deal with the error, you still may see the error surface outside. This is done because browsers do not all show unhandled errors in a promise chain, and the require() call itself does not know if an error handler was chained on the end, so it generates an error to make debugging and development easier.

However, if you are properly chaining error handlers but do not pass an errback as the third arg to the require([]) call, then you can turn off this extra error surfacing by doing:

requirejs.config({
  defaultErrback: null
});

If you pass a function for the defaultErrback value, then that will be used instead of the default "delayedError" handler used by alameda to surface the error.

onError is context-specific

When using contexts, in requirejs, all top level errors would bubble up to requirejs.onError, but in alameda, the context's onError is called instead. Example:

var fooReq = requirejs.config({ context: 'foo' });
requirejs.onError = function () { console.log('requirejs.onError'); };
fooReq.onError = function () { console.log('fooReq.onError'); };

fooReq(['nonexistent']);

// In alameda, fooReq.onError() is called, in requirejs, requirejs.onError is called.

onResourceLoad

requirejs supports a hook into its internals, onResourceLoad. alameda supports an onResourceLoad function too, but the arguments passed to the function are objects that have different property names than the ones in requirejs.

This is the general signature, which is the same between alameda and requirejs:

alameda.onResourceLoad = function (context, map, depArray) {};

The differences between property names in the different argument objects is described below. See the onResourceLoad page for the description of the arguments.

context

alameda requirejs
id contextName

map

alameda requirejs
pr prefix
n name
n/a parentMap
url url
n/a originalName
id fullName

depArray

An array of map objects with the same properties as the map listing above.

License

MIT

Code of Conduct

jQuery Foundation Code of Conduct.

Running tests

The tests are pulled from almond and requirejs. All tests should be served through a local web server, as the text loader plugin is used for some tests, and some browsers restrict local XHR usage when the files are served from a file:// URL.

Bundled tests

To run the tests that are just part of this repo, open tests/index.html in a web browser.

requirejs tests

To run the requirejs tests, first make sure the following projects have been cloned and are siblings to the the alameda repo:

Then do the following:

  • symlink alameda.js to require.js
  • ./copyrequirejstests.sh

requirejs tests that do not pass

  • require.undef()-related tests.
  • onResourceLoadNestedRequire: depends on implementing requirejs.onResourceLoad hook used for builds/some third party tools. This API is not required for normal module loading.

How to get help

More Repositories

1

requirejs

A file and module loader for JavaScript
JavaScript
12,930
star
2

r.js

Runs RequireJS in Node and Rhino, and used to run the RequireJS optimizer
JavaScript
2,568
star
3

almond

A minimal AMD API implementation for use after optimized builds
JavaScript
2,414
star
4

text

An AMD loader plugin for loading text resources
JavaScript
932
star
5

example-multipage

Example RequireJS-based project that has multiple pages that share a common set of modules.
JavaScript
840
star
6

example-multipage-shim

Example RequireJS-based project that has multiple pages that share a common set of modules with shim config
JavaScript
382
star
7

require-cs

An AMD loader plugin for CoffeeScript
JavaScript
335
star
8

require-jquery

A RequireJS+jQuery sample project
JavaScript
261
star
9

example-jquery-shim

Example project that uses jQuery and jQuery plugins via shim config
JavaScript
190
star
10

domReady

An AMD loader plugin for detecting DOM ready
JavaScript
182
star
11

example-jquery-cdn

Example project that uses jQuery and jQuery plugins wrapped as modules
JavaScript
151
star
12

cajon

JavaScript module loader for the browser that can load CommonJS/node and AMD modules
JavaScript
117
star
13

i18n

An AMD loader plugin for loading internationalization/localization string resources
JavaScript
98
star
14

xrayquire

An auxillary script that gives extra info on the use of requirejs in a web page.
JavaScript
74
star
15

example-libglobal

Use AMD modules to develop a JS library that builds to a lib that can be used by "globals only" scripts or as an AMD module
JavaScript
61
star
16

element

An AMD loader plugin for custom elements
JavaScript
56
star
17

requirejs-bower

Repo hold assets for publishing to the bower package manager.
JavaScript
34
star
18

requirejs-npm

Wrappers to allow using RequireJS-related scripts
JavaScript
22
star
19

step

AMD loader plugin that takes a step config to know how to sequential load some files
JavaScript
20
star
20

prim

Promise lib for use inside requirejs-related projects
JavaScript
7
star
21

requirejs-branding

Branding/images/design for RequireJS web site
CSS
6
star
22

browsertests

Standalone browser capability tests to help inform what is possible in a loader
PHP
3
star
23

alameda-prim

The alameda AMD loader that includes private promise shim
JavaScript
3
star
24

requirejs.github.io

requirejs.org site
HTML
2
star
25

requirejs-nuget

Artifact used for pushing to NuGet
JavaScript
2
star