IgnitionJS v4.1.1
IgnitionJS is a fast and flexible, script loader/bootstrapper for AngularJS. IgnitionJS utilizes Cars.com's fork of LABjs to provide simple mechanisms for non-intrusive dependency management, script loading, and function queueing. IgnitionJS is not an attempt to replicate the functionality of module frameworks such as RequireJS (AMD) or CommonJS; instead, it is intended to provide a simple and efficient alternative to these systems with a strong focus on AngularJS.
IngitionJS was built to provide a simple framework which addresses the front-end performance challenges that come with running AngularJS atop an enterprise platform. More specifically, it provides a solution for allowing contributors to place any module on any page without having to load all of the JS required for every module. IgnitionJS solves this problem through the implementation of a simple registration framework. Any module defined within the platform can effectively register its corresponding AngularJS module (along with any dependecies and additional bootstrapping) so that when the page is dynamically generated, it loads and executes exactly what it needs and nothing more.
Instead of explict dependency declarations (through comments, closures, configurations, or otherwise), IgnitionJS implements a tier-based loading and execution system with an easy to learn, easy to configure API.
Bower Install
bower install ignition
Download
Examples
Examples <!-- LABjs is required by IgnitionJS --> <!-- Include IgnitionJS --> IgnitionJS Example <!-- Common Modules The following directives work because we've registered the modules they are dependent on in the document head. --> <!-- Module with Third-Party Dependency Assume the following block has been rendered via server-side include. It needs to register an additional dependency (facebook sdk) as well as an additional AngularJS module before the directive it contains will work. --> <!-- Function Registration As with the above example, assume the following block has been rendered via server-side include. In this example, we make a GPT ad call by registering a function to be called on the second tier. Note we use the alias `ads` which we defined in the page head. Also note, we're registering this function to the second tier instead of the first to ensure that the GPT bootstrapping which we registered on the first tier runs prior to our attempt to make an the ad call. --> <!-- Finally, we call `load` immediately before the closing body tag to kick things off. -->
Additional configuration options
var ignition = // Bundle tier options bundles: // `bundles.dir` sets the base bundles directory dir: '/js/bundles' // `bundles.validation` is a predicate function which is used to validate module names { return typeof subject === 'string' && /^[A-Za-z\-]+\w*$/; } // `bundles.modules` is a map which assigns a set of module names to a given bundle bundles: 'common': 'commom' 'user' 'social' // `bootstrap` overrides the default angular bootstrap callback { angular; } // Dependency tier options tiers: // First tier // Include an empty object for any tier for which you do not // want to provide any additional configuration. Defaults will // be applied. {} // Second tier // As shown in the above example, you can define as many // aliases for any given tier as you need... aliases: 'base' 'first' // You can provide an optional predicate function for // validating all source registration attempts. If you // don't provide a validation function, any string value // will be accepted. { return /^\/vendor\/js\//; } // ... you can continue add as many tier configuration objects as you need. ;
Build
gulpgulp watch
Lint
gulp lint
Test
gulp testgulp test --watchgulp test --coverage
Requires LABjs 2.0.3 http://labjs.com/.