Cheap and easy js module loader

README.md

okay so basically this will scan for elements with a css class and attach the module to them, this pattern is v good because your module code is separate from binding, which means you can scale it up to ajax sites.

doing async imports is totes optional but it lets you have a single list of modules

index.js

const modules = [
	'whatevers',
	'trigger-modal',
	'trigger-popover',
	'header',
]

modules.map(selector=>{
	const $elements = document.querySelectorAll('.'+selector);
  /*IE9 doesn't do .forEach() :( */
	for (i = 0; i < $elements.length; ++i) {
		let $element = $elements[i];
		System.import('./module-'+selector).then(Module=>{
			new Module.default($element).apply()
		})
	}
})

module-base.js

export default class base {

	constructor($element) {
		this.$element = $element;
	}

	apply() {
   /*
   i kinda like this second 
   constructor pattern because it lets
   you change the # of parameters for the 
   constructor later on
   */
	}

}

module-whatevers.js

import base from './module-base';

export default class header extends base {

	apply() {
      console.log(this.$element);
	}

}