N4JS Design Specification

export var value = 100; // <--- named export of a variable
export function inc() { // <--- named export of a function
    value++;
}

import {value, inc} from "src"

var importedValue = value; // <--- using the imported value
inc(); // <--- using the imported function

$ babel <inputdir> --out-dir <outputdir> --modules system

System.register([], function (_export) {
    "use strict";

    var value;

    _export("inc", inc);

    function inc() {
        _export("value", value += 1);
    }

    return {
        setters: [],
        execute: function () {
            value = 100;

            _export("value", value);
        }
    };
});

System.register(["src"], function (_export) {
  "use strict";

  var value, inc, importedValue;
  return {
    setters: [function (_src) {
      value = _src.value;
      inc = _src.inc;
    }],
    execute: function () {
      importedValue = value;
      inc();
    }
  };
});

var System = require('systemjs'); // <--- Require SystemJS
System.transpiler = 'babel'; // <--- Configure SystemJS

System.import('main'); // <--- Import the transpiled "main" module.

traceur --dir <SOURCE_DIR> <OUTPUT_DIR> --experimental --modules=instantiate

babel <SOURCE_DIR> --out-dir <OUTPUT_DIR> --modules system

{
    "compilerOptions": {
        "module": "system",
        "target": "ES5",
        "outDir": <OUTPUT_DIR>,
        "rootDir": <SOURCE_DIR>
    }
}

tsc

import {b1} from 'B';

System.register(['B'], function (<<exportFn>>) { //(1.)

  var b1;  //(2.)

  return {

    //(3.)
    setters: [function (_B) {
      b1 = _B.b1; //(4.)
    }],

    execute: function () {}
  };
});

import { a1 as a0 } from 'A';
import {b1} from 'B';
import { c1 as c0 } from 'C';
import {b2, b3} from 'B';
import {default} from 'C';
import {a2} from 'A';

System.register(['A', 'B', 'C'], function (<<exportFn>>) { //(1.)

  var a0, a2, b1, b2, b3, c0, default;  //(2.)

  return {

    //(3.)
    setters: [function (_A) {
      a0 = _A.a1;         //(4.1.)
      a2 = _A.a2;         //(4.2.)
    }, function (_B) {
      b1 = _B.b1;
      b2 = _B.b2;
      b3 = _B.b3;
    }, function (_C) {
      c0 = _C.c1;
      default = _C['default'];
    }],


    execute: function () {}
  };
});

export var v =1;
export function f(){}

System.register([], function (_export) {  //(1.)

   //(2.)
  var v;
  function f() {}

  _export("f", f); //(4.1)

  return {
    setters: [],

    //(3.)
    execute: function () {
      v = 1;  //(3.1.)

      _export("v", v); //(4.2.)
    }
  };
});

export var v1 = 1;
export var v2 = 2;
export var v3 = 3;
export function f() {}

v1++; //(1.)
++v2; //(2.)
v3 += 5; //(3.)
f = null; //(4.)

System.register([], function (_export) {

  var v1, v2, v3;

  _export("f", f);

  function f() {}

  return {
    setters: [],

    execute: function () {
      v1 = 1;

      _export("v1", v1);

      v2 = 2;

      _export("v2", v2);

      v3 = 3;

      _export("v3", v3);

      _export("v1", v1 += 1); //(1.)
      _export("v2", v2 += 1); //(2.)
      _export("v3", v3 += 5); //(3.)
      _export("f", f = null); //(4.)
    }
  };
});

System.register([], function($__export) {

  var v1, v2, v3;
  function f() {}

  $__export("f", f);

  return {
    setters: [],

    execute: function() {
      v1 = 1;
      $__export("v1", v1);
      v2 = 2;
      $__export("v2", v2);
      v3 = 3;
      $__export("v3", v3);

      ($__export("v1", v1 + 1), v1++); //(1.)
      $__export("v2", ++v2); //(2.)
      $__export("v3", v3 += 5); //(3.)
      $__export("f", f = null); //(4.)
    }
  };
});

System.register([], function(exports_1) {
    var v1, v2, v3;
    function f() { }

    exports_1("f", f);

    return {
        setters:[],

        execute: function() {
            exports_1("v1", v1 = 1);
            exports_1("v2", v2 = 2);
            exports_1("v3", v3 = 3);

            (exports_1("v1", ++v1) - 1); //(1.)
            exports_1("v2", ++v2); //(2.)
            exports_1("v3", v3 += 5); //(3.)
            f = null; //(4.)
        }
    }
});

import {A} from "A"; //<-- import class A

export class C extends A {}

System.register(["A"], function (_export) {

  var A, C;

  var _get = function get(_x, _x2, _x3) { ... };

  function _classCallCheck(instance, Constructor) { ... }

  function _inherits(subClass, superClass) { ... }

  return {
    setters: [function (_A2) {
      A = _A2.A;
    }],

    execute: function () { //(1.)
      C = (function (_A) {
        _inherits(C, _A);

        function C() {
          _classCallCheck(this, C);

          _get(Object.getPrototypeOf(C.prototype), "constructor", this).apply(this, arguments);
        }

        return C;
      })(A);

      _export("C", C);
    }
  };
});

System.register(["A"], function($__export) {
  var A, C;

  return {
    setters: [function($__m) {
      A = $__m.A;
    }],

    execute: function() { //(1.)
      C = $traceurRuntime.initTailRecursiveFunction(function($__super) {
        return $traceurRuntime.call(function($__super) {
          function C() {
            $traceurRuntime.superConstructor(C).apply(this, arguments);
          }
          return $traceurRuntime.continuation($traceurRuntime.createClass, $traceurRuntime, [C, {}, {}, $__super]);
        }, this, arguments);
      })(A);
      $__export("C", C);
    }
  };
});

System.register(["A"], function(exports_1) {
    var __extends = function(){ ... }
    var A_1;
    var C;

    return {
        setters:[
            function (A_1_1) {
                A_1 = A_1_1;
            }],

        execute: function() { //(1.)
            C = (function (_super) {
                __extends(C, _super);
                function C() {
                    _super.apply(this, arguments);
                }
                return C;
            })(A_1.A);
            exports_1("C", C);
        }
    }
});