Skip to content


Repository files navigation

What this project is for?

This demo accompanies this blog post

An ES6 module and systemjs/builder demo project. In this project, you can find examples of how to write ES6 JavaScript modules, how to load them using systemjs and how to leverage systemjs plugins to load many kinds of resources other than JavaScript, e.g. HTML templates, LESS files, etc.

You can also find examples of how to create a workflow that makes development time much easier and also easily builds/bundles for production.


Clone this repository:

git clone

Install all npm packages:

npm install --no-optional

Install all jspm packages:

jspm install

Run the bundle script (this is to be used in example-bundle.html):

node example-bundle.js

Finally launch browser-sync and browse to the examples to see the results:

gulp serve


example.html: An example of how to load ES6 module, HTML and LESS in browser on the fly during development time

example-bundle.js: An example of how to transpile ES6 modules into ES5 codes, compile LESS into css and bundle all of them together in node during build time for production

example-bundle.html: An example of how to load the systemjs bundle file. You can see how different the network roundtrips are between the example.html file and this file. Note: Make sure you run node example-bundle.js before opening this page




A demo project of ES6 module and systemjs loader






No releases published


No packages published