Angular 2的第三方模块系统

Question

Following the official guide of Angular 2 with JavaScript (not TypeScript), at the beginning of the guide, under the "Modules" sub-heading, it is written that:

"ES5 JavaScript doesn't have a native module system. There are several popular 3rd party module systems we could use. Instead, for simplicity and to avoid picking favorites, we'll create a single global namespace for our application."

and the code for a basic application is this:

(function(app) {
  app.AppComponent =
    ng.core.Component({
      selector: 'my-app',
      template: '<h1>My First Angular 2 App</h1>'
    })
    .Class({
      constructor: function() {}
    });
})(window.app || (window.app = {}));

Since I'm not a professional JavaScript coder, I wonder how we can use a 3rd party module system instead of (function(app){})(); (or not instead of?)
Give me some examples of 3rd party module system with this code modified, please. Thanks in advance.

Answer 1

you can refer to the demo

and also view this question