#1 Passing parameter to method
Starting of slow, we let our require module return a JavaScript object with a method that accepts a parameter. This is pretty basic stuff, and should be sufficient for most scenarios.
index.html
<script src="scripts/require.js"></script>
<script>
require(['scripts/app'], function(app){
app.greet('World');
});
</script>
app.js
define(function(){
return {
greet: function(name){
alert('Hello ' + name);
}
};
});
#2 Passing object to method
While #1 works great when you have one, or only a handful of parameters, it can get quite messy when you're dealing with a lot of parameters. To counter this we can let our module accept an object instead.
index.html
<script src="scripts/require.js"></script>
<script>
require(['scripts/app'], function(app){
app.greet({
salutation: 'Dr.',
name: 'Who'
});
});
</script>
app.js
define(function(){
return {
greet: function(config){
alert('Hello ' + config.salutation + ' ' + config.name);
}
};
});
#3 Using RequireJS configuration
By loading the pre-defined RequireJS module aptly named "module" into your own module, you can define and access configuration data.
Note: The definition must be done before you include the require.js file, and this only works for define and not require modules.
index.html
<script>
var require = {
config: {
'app': { //This must match your module name
name: 'Sherlock'
}
}
};
</script>
<script data-main="scripts/app" src="scripts/require.js"></script>
app.js
define(['module'], function(module){
alert('Hello ' + module.config().name);
});
#4 Using a separate configuration module
Sometimes you'll have multiple modules needing the same input, then you can define a separate configuration module, and load it into your module like any other. I think this gives an nice clean separation between logic and data, but it can be a bit of an overkill i many situations.
index.html
<script>
var require = {
config: {
'config': {
name: 'Everybody'
}
}
};
</script>
<script data-main="scripts/app" src="scripts/require.js"></script>
config.js
define(['module'], function(module){
return {
name: module.config().name
}
});
app.js
require(['config'], function(config){
alert('Hello ' + config.name);
});