modkit-loader

Runtime Module Loader

Usage no npm install needed!

<script type="module">
  import modkitLoader from 'https://cdn.skypack.dev/modkit-loader';
</script>

README

Modkit Loader

Quality Gate Status Coverage Version Downloads License

Modkit Loader is a customization library that allows you to add modules to your application, at runtime.

Documentation

Full documentation website can be found here.

Installation

With any web UI Framework

# Install the dependency
npm install modkit-loader --save
// Javascript
const Modkit = require('modkit-loader');
// ES6 or TypeScript
import * as Modkit from 'modkit-loader';

With CDN

As Modkit Loader uses code-splitting, we cannot bundle the library as a standard UMD build. With modern browsers, that's not an issue, but when targeting IE11, you'll need something more.

<!-- Modern Browsers -->
<script type="module">
  import * as Modkit from 'https://unpkg.com/modkit-loader/dist/module/index.js';
  // Modkit is available
</script>
<!-- IE11 (Needs polyfills and systemjs before loading)-->
<script nomodule src="https://unpkg.com/bluebird/js/browser/bluebird.core.min.js"></script>
<script nomodule src="https://unpkg.com/whatwg-fetch/dist/fetch.umd.js"></script>
<script nomodule src="https://unpkg.com/systemjs/dist/s.min.js"></script>
<script nomodule>
  System.import('https://unpkg.com/modkit-loader/dist/system/index.js').then(function (Modkit) {
    // Modkit is available
  });
</script>

Usage

Load a module

Once the Modkit Singleton is imported, you can load a module:

Modkit.load('/path/to/my-module/manifest.json')
  .then((m) => {
    // Here, "m" is an object containing all manifest properties along with other computed properties
    m.mod // This is the module itself
    m.rootPath // This is the root path to the module build, that is helpful for static assets
  });

Features

  • Dynamically load packages at runtime, supporting all formats via a single load method.
  • Will automatically load what is needed depending on the module format (require.js for amd modules, system.js for system modules).
  • Has module manifest validation (global and on-load)
  • Supports module dependencies (libraries or other modules), with semver versioning for compatibility.

License