Info.html

<link rel="import" href="/tv/task/List.html">
<link rel="import" href="/tv/task/Header.html">
<style>
	.tv-task-header {
		background: #f00;
	}
</style>
<script>
// some random example
package("task", function(exports){
	exports.Info = Info;
	function Info(){
		this.id = 0;
		this.header = new tv.task.Header();
	}
});
</script>

pkg.js

var global = window || this;
global.package = function package(name, setup){
	if(name == ""){
		throw new Error("package name cannot be empty");
	}

	var info = package.find(name);
	console.info("loading:", name);
	setup(info.namespace);
};

global.package.find = function(name){
	var created = false;
	var path = name.split(".");
	var namespace = global;
	for(var i = 0; i < path.length; i++){
		var token = path[i];
		var next = namespace[token];
		if(next){
			created = false;
		} else {
			next = {};
			namespace[token] = next;
			created = true;
		}
		namespace = next;
	}

	return {
		namespace: namespace,
		created: created
	};
}