yarjs
Yet Another Require javascript solution... for the that inner pirate who doesn't want to read a boat load of documentation.
About
yarjs is basically a lightweight (476 bytes uglified) solution replacement for stuff like browserify and RequireJS.
It exposes two methods (__import and __export) which allow you to never worry about ordering of your scripts
Installation
npm install yarjs --save
Use it with expressjs
app.use('/yar.js', express.static(path.join(__dirname, 'node_modules/yarjs/dist/yar.js')));
views/layout.jade
doctype html
html
head
title= title
link(rel='stylesheet', href='/stylesheets/style.css')
body
block content
script(src='/yar.js')
script(src='/javascripts/crazy_pirate_lib.min.js')
Usage
Load yar.js first, all other files can be loaded in any order. gulp-concat them all if you like.
Examples
main/sub1/Class1.js
(function() {
function Class1() {
this.saymyname();
}
Class1.prototype.myname = 'Class1';
Class1.prototype.saymyname = function() {
console.log(this.myname);
};
__export('main.sub1.Class1', Class1);
})(); // EOF
main/sub2/Class2.js
__import(
'main.sub1.Class1',
function(Class1) {
function Class2() {}
Class2.prototype.constructor = Class1
Class2.prototype = new Class1();
Class2.prototype.myname = 'Class2';
__export('main.sub2.Class2', Class2);
}
); // EOF
main/do_something.js
__import(
'main.sub1.Class1, main.sub2.Class2',
function(Class1, Class2) {
var obj1 = new Class1();
var obj2 = new Class2();
obj1.saymyname();
obj2.saymyname();
}
); // EOF
main/do_something_a_different_way.js last argument is the callback
__import(
'main.sub1.Class1',
'main.sub2.Class2',
function(Class1, Class2) {
var obj1 = new Class1();
var obj2 = new Class2();
obj1.saymyname();
obj2.saymyname();
}
); // EOF
Circular References
Break up your classes that need to reference each other so that they can grab a reference to each other...
Circular1.js
__import(
'Circular2.ref',
function(Circular2Ref) {
// cannot call Circular2Ref() yet because Circular2 is
// waiting for us to export in order to create its constructor
Circular1.prototype.myname = 'no_name';
Circular1.prototype.constructor = function(myname) {
this.myname = myname || this.myname;
};
Circular1.prototype.setMyName = function() {
this.myname = 'Circular1';
};
Circular1.prototype.sayMyName = function() {
console.log('My name is', this.myname);
};
Circular1.prototype.sayMyOtherName = function() {
if( !this.otherSelf ) this.otherSelf = new Circular2Ref();
this.otherSelf.sayMyName();
};
__export('Circular1', Circular1); // Circular2's import will now execute
}
)(); // EOF
Circular2.js
Circular2 has to wait for Circular1 to define it's prototype so that Circular2 can call new Circular1()
to set its prototype.
(function() {
var Circular2 = {};
__export('Circular2.ref', Circular2); // Yield to Circular1 so it can finish defining its prototype
// now we can import Circular1
__import(
'Circular1',
function(Circular1) {
Circular2.prototype = new Circular1();
Circular2.prototype.name = 'Circular2';
Circular2.prototype.constructor = Circular1;
var c1 = new Circular1();
c1.sayMyName(); // My name is no_name
c1 = new Circular1('John');
c1.sayMyName(); // My name is John
var c2 = new Circular2();
c2.sayMyName(); // My name is Circular2
c2 = new Circular2('Jack');
c2.sayMyName(); // My name is Jack
c1.sayMyOtherName(); // My name is Circular2
c2.sayMyOtherName(); // My name is Circular2
}
);
)(); // EOF