Systemjs is a minimal system loading tool that creates plug-ins to handle alternative scenario loading processes, including loading CSS scenarios and images, running primarily in the browser and NodeJS. It is an extension of the ES6 browser loader and will be applied in the native browser. Typically, the plug-in name created is the module itself, or the default plug-in name is the extension name of the module if it is not specifically specified.

The common types of plugins it supports are:

CSS System.import(‘my/file.css! ‘)

Image System.import(‘some/image.png! image’)

JSON System.import(‘some/data.json! ‘).then(function(json){})

Markdown System.import(‘app/some/project/README.md! ‘).then(function(html) {})

Text System.import(‘some/text.txt! text’).then(function(text) {})

WebFont System.import(‘google Port Lligat Slab, Droid Sans ! font’)

Example:

System.formats = ['amd'.'cjs'.'myformat'.'global'];

  System.format.myformat = {
    detect: function(source, load) {
      if(! source.match(formatRegEx))return false;

      // return the array of dependencies
      return getDeps(source);
    },
    execute: function(load, depMap, global, execute) {
      // provide any globals
      global.myFormatGlobal = function(dep) {
        return depMap[dep];
      }

      // alter the source before execution
      load.source = '(function() {' + load.source + '} (); ';

      // execute source code
      execute();

      // clean up any globals
      delete global.myFormatGlobal;

      // return the defined module object
      return global.module; }}Copy the code